All about {Web}

[CSS] TEXT Property (14개의 속성 ) :  color

Text 관련 속성(Property)

Property 

Description 

example 

 01.color

 텍스트의 색상 설정

 p { color: blue; }

 02.direction

 텍스트 방향을 설정 ( ltr, rtl )

 p { direction: rtl; }

 03.letter-spacing

 글자 사이의 여백 설정

 p { lettet-spacing : 3px }

 04.line-height

 줄 높이를 정하는 속성

 p { lettet-spacing : 3px }

 05.text-align

 텍스트의 정렬 (left, right, center)

 p { text-align : center; }

 06.text-decoration

 선으로 텍스트를 꾸밀 수 있게 해주는 속성

 

 07.text-indent

 들여쓰기 또는 내어쓰기 속성

 

 08.text-shadow

 글자에 그림자 효과를 주는 속성

 

 09.ext-transform

 대문자 또는 소문자로 바꾸는 속성

 

 10.ext-overflow

 글자 자르기

 

 11.unicode-bidi

 참조

 

 12.vertical-align

 세로 정렬 방식 설정

 

 13.white-space

 요소 안의 공백 처리 방법을 지정

 

 14.word-spacing

 단어 사이의 간격을 정하는 속성

 

unicode-bidi : direction 속성과 함께 사용되어 같은 문서에서 여러 언어를 지원하도록 텍스트를 재정의해야하는지 여부를 설정


01. color :  글자의 색상 설정

- 색상 표현방법 
CSS 에서 사용할 수 있는 색상코드는 Hexadecimal color(가장 많이 사용하는 방법), RGB color, RGBA color, HSL color, HSLA color, Predefined/Cross-browser color names 처럼 다양한 종류가 있다.

A. 색상이름 표기법 :  색상이름으로 표기  ex)  red, blue, black, white

B. 
16진수 표기법 :  
-  0~f까지의 범위로 6자리 숫자 표기 #000000, #ffffff ( 0은 검정색, f는 흰색 )
- 기본은 6자리 수 로 표기하나 같은 수가 2개씩이면 세자리로도 표현가능
-  ex) #000000=#000 , #ffffff=#fff

C. 
rgb, rgba 표기법 :
- red, green, blue  약자 rgb   -0~255 까지의 색레벨
- rgb (색상값, 
색상값, 색상값)  ex) rgb(0,0,255) - 파란색, rgb(255,0,0) - 빨간색
- rgba 
(색상값, 색상값, 색상값, 투명도)  ex) rgb(0, 255, 0, 0.5) - 투명도 0.5의 초록색

example)

<!--Hexadecimal color-->
{ color:#00ff00; }

<!--RGB color-->
{ color:rgb(255,0,0); }

<!--RGBA color-->
{ color:rgba(255,0,0,0.5); }

<!--HSL color-->
{ color:hsl(120,65%,75%); }

<!--HSLA color-->
{ color:hsla(120,65%,75%,0.3); }

<!--Predefined/Cross-browser color names-->
HTML과 CSS에서 사용 가능한 색상 이름은 147가지이다. 아래 예제처럼 red, blue, yellow 등으로 사용할 수 있다.
{ color:purple; }