CSS 글씨 컬러 변경하는 방법

 

CSS 글씨 컬러 변경하는 방법

 

개발을 수행하다보면 웹문서에서 글자의 색상을 바꾸고 싶은 경우가 있습니다. 문장의 중요한 내용의 글자 색상을 적절하게 조절하여서 강조를 할 수도 있겠구요. 아마 좀더 가독성 있는 문자를 만들 수 있을 것입니다. 이번 내용에는 글자 색상을 변경 하는 방법에 대하여 알아보도록 하겠습니다.

---

---

1. HTML 활용

1) font 태그의 활용

HTML	RESULT
<font color="red">글자색상 : 붉은색</font></br> <font color="blue">글자색상 : 파란색</font></br> <font color="#FFFF00">글자색상 : 노란색</font></br> <font color="#00FF00">글자색상 : 녹색</font></br>	글자색상 : 붉은색 글자색상 : 파란색 글자색상 : 노란색 글자색상 : 녹색

 

font color 를 사용하는 방법으로 위의 내용과 같이 색상의 영문값이나 RGB HEX 값을 넣으시면 색상을 변경하실 수 있습니다.

 

2)인라인 방법

HTML	RESULT
<p style="color:red">글자색상 : 붉은색</p> <p style="color:blue">글자색상 : 파란색</p> <p style="color:#FFFF00">글자색상 : 노란색</p> <p style="color:#00FF00">글자색상 : 녹색</p>	글자색상 : 붉은색 글자색상 : 파란색 글자색상 : 노란색 글자색상 : 녹색

HTML 태그의 Style 속성을 활용하는 방법으로 color를 명시하고 변경 컬러를 넣어주시면 됩니다.

 

2. CSS활용

HTML	CSS	RESULT
<p>글자색상 : 붉은색</p> <div>글자색상 : 파란색</div> <p class="green">글자색상 : 노란색</p> <p class="yellow">글자색상 : 녹색</span>	p { color : red; } div { color : blue; } .green { color : #FFFF00; } .yellow { color : #00FF00; }	글자색상 : 붉은색 글자색상 : 파란색 글자색상 : 노란색 글자색상 : 녹색