html 글자색

html 글자색


■ html을 이용해서 웹 문서를 만들 때 중요한 단어에는 특정 포인트를 줘서 돋보이도록 설정하기 마련인데요. 가장 대표적인 방법이 글자색을 다르게 표현하는 방법일 겁니다. 단락 전체의 글자색을 설정해줄 수도 있고, 특정 단어나 문장만 따로 설정해서 글자색을 바꿀 수도 있는데요. 그 방법에 대해서 알아보도록 하겠습니다. 그 외에도 형광펜과 같은 효과를 주는 <mark>태그도 적용해볼게요. 먼저 html 글자색을 바꾸기 위해서 간단하게 예제를 하나 만들어 보겠습니다. 

■ <p>태그를 이용해서 하나의 단락을 입력해봤습니다. 


 ■ 웹 페이지에서 출력한 화면인데요. 하나씩 글자색을 바꿔보겠습니다. 먼저 이 단락 전체의 글자색을 변경해볼게요. 


■ <p> 태그의 'color' 값만 설정해주면 이 단락의 전체 글자색이 설정해준 값으로 적용됩니다. 


■ 그림처럼 단락 전체의 글자색이 파란색으로 변경되구요. 이제 특정 부위만 글자색을 바꿔보겠습니다. 


■ 단락에 어느 일부분만 따로 스타일을 적용할 때는 <span> 태그를 이용하면 됩니다. 효과를 줄 부분을 묶어주고 스타일 속성을 이용해서 색을 빨간색으로 변경했습니다. 결과를 보면....


■ 이렇게 <span> 태그로 묶은 부분만 색이 바뀌어서 적용되는 걸 확인할 수 있습니다. 마지막으로 형광펜 효과인 <mark> 태그를 이용해보고 마무리할게요. 


■ 효과를 적용할 부분을 <mark> 태그로 묶어주기만 하면 됩니다. 


■ 이렇게 형광펜을 칠한 것과 같은 효과를 만들 수 있습니다. 참고로 알고 계시다가 이용해보세요. 수고하셨습니다.