• Q&A
  • 회원가입
  • 로그인

[text] CSS - color 속성 ★ - 글자색깔 (=글자색상=글자색깔=글자컬러 = 텍스트색깔 = 컬러속성 = color속성, 상속O)

color 예제 
[방법1]
 
<style>
h1 {color: red;}
</style>
 
<h1>홈짱닷컴 (homzzang.com)</h1>
 

[방법2]
 
아래처럼, 줄 바꿔 표현해도 됨. 
대개, 여러 속성을 함께 사용할 땐 이렇게 줄을 바꾸는 방식으로 표현.
이렇게 줄을 바꿔 적을 때에도 반드시 속성값 뒤에 ; (세미콜론) 붙여야 함.
단, 속성이 하나 뿐이거나, 맨 마지막에 온 속성일 경우엔 적지 않아도 됨.
 
<style>
h1 {
     color: red;
}
</style>

<h1>홈짱닷컴 (homzzang.com)</h1>



[방법3] 
 
태그 요소 안에서 글자 색깔 지정하려면 아래처럼 하면 됨. (인라인 스타일)
<h1 style="color: red;">홈짱닷컴 (homzzang.com)</h1>

 

결과보기

 

 

color 정의

 

특정 태그 요소의 글자 색깔 지정할 때 사용

 


 

1.

가독성을 위해서 텍스트색상과 대비되는 배경색도 함께 지정 권장.

 

2.

기본값: 미지정

상속여부: O

애니효과 :O

CSS버전: CSS1

JS구문 : object .style.color = "#0000FF"

 

3.

모든 브라우저 지원.

 

 

 

color 구문

 

selector{color: 속성값;}

 


[속성값]

 

속성값으로 올 수 있는 것들은 여러 종류지만, 주로 아래 방식 중 하나 사용.
  
1-1. 
색상명 입력 방식 : red (빨강)
 
1-2. 
Hexadecimal color입력 방식 : #FF0000 (빨강)      색상코드 표 보기
 
1-3. 
RGB 입력 방식 : rgb(255,0,0) (빨강)

https://homzzang.com/b/css-275

 

1-4.  

부모 요소의 색상값 상속 경우 안 적어도 되나, inherit 적어 명시 가능.

 
<style>
div {color: red;}
h1 {color: inherit;}
</style>
 
<div>
   <h1>홈짱닷컴 (homzzang.com)</h1>
</div>
  

오늘도 즐겁게 열심히 .....

찾아주셔서 감사합니다. Since 2012