[CSS] 글꼴

- 웹 문서에서 사용할 글꼴은 font-family속성으로 지정한다.

- 부모요소의 글꼴을 지정해주면 자식요소로 상속된다. 따라서 보통 제일 윗 요소인 body에 선언한다. 

- 서체명이 한글이거나 공백이 있는 경우 인용부호로 감싼다.

- 한글명은 영문명으로 다시 한 번 써준다. 인식을 못하는 컴퓨터도 있기 때문이다.

- 한 가지 글꼴만 지정해줘도 되지만 지정한 글꼴이 없을 경우를 대비해 두 번째, 세 번째 글꼴까지 지정한다.

 

 

1. font-size

font-size의 속성값으로는

절대크기, 상대크기, 크기값 직접 지정, 백분율이 올 수 있다.

 

크기 값을 직접 지정하는 경우

고정되어 있는 단위인 px말고도 em과 rem이라는 단위가 있다.

 

 

  * em

부모 요소에서 지정한 폰트의 대문자 M의 너비를 1em으로 놓고 상대적 값을 계산하는 것이다.

따로 지정한 크기가 없을 시, 16px이 기본 값 1em이 된다.

값을 구할 때 %단위로 계산해서 구하면 뭔가 더 구하기 쉽다고 한다.

 

이와 비슷한 것으로 rem이 있는데 root em이라는 의미이다.

따라서 html, body의 글자 크기가 기준이라고 한다.

 

 

 

 

출처

- 고경희, HTML5 + CSS3 웹표준의 정석, 2020, 215-221쪽.