[CSS] 글자 속성

글자 모양 관련 속성

속성	설명
font-family	글꼴의 이름을 쉼표로 구분하여 나열
font-size	글자크기 ( px단위를 주로 사용함 )
font-style	글자의 기울임 여부 --> italic, normal(기본값)
font-weight	글자의 굵게 표현 여부 --> bold, normal
color	글자 색상
line-height	한 줄의 높이 (px, %단위 표현) --> %단위 인 경우 font-size를 기준으로 함
font	일괄 표현 ▼ [style] [weight] size[/line-height] family

---

웹 폰트

CSS에서 font-family 속성으로 지정한 글꼴이 접속자의 PC에 설치되어 있지 않을 경우 고르게 표시되지 않는 문제를 해결하기 위해 폰트파일을 온라인에 올려두고 접속자의 PC에 설치되어 있지 않은 경우 웹 상 글꼴을 내려받아 사용할 수 있게 하는 기법

ex) 구글 웹 폰트 (https://fonts.google.com/)

---

텍스트 그림자 효과

text-shadow: x-offset y-offset blur-radius color;

x-offset : 본체와 그림자의 가로축 거리 (px단위), + 값인 경우 오른쪽 방향

y-offset : 본체와 그림자의 세로축 거리 (px단위), + 값인 경우 아래 방향

blur-radius : 그림자의 번짐 정도 (px단위)

color : 그림자의 색상

그림자 관련 값들을 콤마로 구분하여 여러개 지정할 경우 포토샵의 레이어 처럼 처리할 수 있다.

text-shadow: x-offset y-offset blur-radius color,    x-offset y-offset blur-radius color,    x-offset y-offset blur-radius color,    x-offset y-offset blur-radius color;