#09. 폰트 꾸미기

body {

font-family : verdana, Arial, sans-serif;  <!--사용할 글꼴 폰트와 그룹-->

font-size : 14px ; <!--사용할 폰트 크기 : 직접입력 - small 기준 (12px정도), px / % / em 중 설정-->

color : silver; <!--텍스트 색상-->

font-weight : bold; <!--사용할 폰트 굵기-->

text-decoration : underline; <!--텍스트에 스타일 가미하기-->

}

* font-family 사용법 

font-family : 폰트이름은 정확히 작성 (대/소문자구문해서 작성), 같은 패밀리에서 대체할수 있는 폰트 작성, 어떤 패밀리인지 제일 나중에 작성 

ex) font-family : Time, Palomino, serif ;  

font 패밀리

산-세리프(sans-serif) : 세리프가 없는 폰트, 끝부분에 장식용 가시와 고리 모양이 없음

세리프(serif) : 끝 부분에 장식용 가시와 고리 모양이 있음 (ex. times체)

모노스페이스(Monospace) : 일정한 폭의 문자 폰트로 이루어짐. 알파벳당 간격이 동일

흘림체 (cursive) : 손으로 쓴것 같은 폰트 포함

판타지 (fantasy) : 화려한 양식의 폰트

Web Font 형식

TrueType fonts (.ttf) 

OpenType fonts (.otf) 

Embeded OpenType fonts(.eot) : IE 에서만 지원

SVG fonts (.sgv) : 그래픽 형식의 폰트 사용

Web open font format (.woff) : 웹 폰트 표준으로 개발되고 대부분의 최신 브라우저에서 지원

*.ttf 와 .woff는 

* 웹 컬러 참고 사이트 

https://en.wikipedia.org/wiki/Web_colors

* hex 코드 → 10진수 변경 공식 // 두자리씩 나눠서 입력

(가장왼쪽자리수 10진수로 변경 * 16) + 오른쪽자리 10진수로 변경한 값 = 10진수  

Font 색상 넣기

body {

background-color : red ; <!--색상이름으로 직접 입력-->

color : rgb (205, 102, 0) ; <!-- RGB 값으로 입력-->

}

P {

color : rgb (80%, 30%, 10%) ; <!--RGB %로 입력 -->

}

h1{

color : #CC6600 <!-- hex 코드로 입력 -->

}