[HTML/CSS] font-family 속성에 대하여

 

html/css font-family에 대해서 알아보려고 합니다

 

 

---

 

★font-family 속성이란..?

css에서 원하는 글꼴을 지정할 때 font-family 속성을 사용한다.

 

 

☆사용 예

div {

   font-family: Verdana, "Times New Roman", arial;

}

 

 

☆font-family에 대해서

-글꼴 집합

-맨 앞에 글꼴이 컴퓨터에 없다면 그 다음 글꼴을 사용한다.

-지정한 글꼴이 모두 없다면 기본값으로 표시된다.

-font-family는 family-name과 generic family로 나뉨

-

family-name: 글꼴이름

generic family: 모양이 비슷한 글꼴 그룹

 

 

 

☆font-family 사용 법!!

1. 하나 이상의 글꼴을 열거할 때 쉼표를 쓴다.

2. 글꼴 이름에 공란이 들어갈 경우 쌍따옴표로 감싸준다.

3. 시작은 family-name, 마지막은 generic family로 설정한다

    (해당 글꼴이 없을 경우, 비슷한 글꼴체로 표시하기 위해)

 

☆Safe web Font(안전한 웹 글꼴)

●Serif 바탕체계열
Courier
Courier New
Georgia
Times
Times New Roman

●Sans-Serif 고딕체계열
Arial
Arial Black
Tahoma
Trebuchet MS
Verdana

●Monospace 가로폭이 동일한 글꼴
Courier
Courier New

●cursive 필기체 계열
Comic Sans
(Window & Macintosh에서만 지원)

 

 

 

 

※ 구글에서 제공하는 무료폰트
https://www.google.com/fonts