CSS) font-weight

1) font-weight
글자의 두께(가중치)를 지정

속성 값

값	의미	기본값
normal	기본 글자 두께, 400과 동일	normal (400)
bold	글자 두껍게, 700과 동일
bolder	부모(상위)요소보다 더 얇게
lighter	부모(상위) 요소보다 더 얇게
숫자	100부터 900까지의 100단위의 숫자 9개, normal과 bold 이외의 두께를 제공하는 글꼴(서체)를 위한 설정

 

일반적인 두께의 이름
font-weight의 각 값은 일반적으로 다음과 같은 글꼴의 이름으로 표현됨

값	일반적인 두께 이름
100	Thin(Hairline)
200	Extra Light(Ultra Light)
300	Light
400	Normal
500	Medium
600	Semi Bold(Demi Bold)
700	Bold
800	Extra Bold(Ultra Bold)
900	Black(Heavy)

 

상대적 두께
bolder나 lighter를 사용할 경우 보무(상위)요소에게 상속받은 값에서 다음과 같이 계산됨

상속 값	bolder	lighter
100	400	100
200	400	100
300	400	100
400	700	100
500	700	100
600	900	400
700	900	400
800	900	700
900	900	700

 

숫자 값과 두께의 불일치
글꼴(서체)의 정확한 두께를 숫자로 표현할 수 없는 경우에만.. 원리

1. 400이 주어지면 500을 사용하고, 500이 불가하면 500미만의 다른 두께 사용
2. 500이 주어지면 400을 사용하고, 400이 불가하면 400미만의 다른 두께 사용
3. 400미만 값이 주어지면, 가장 가까운 숫자의 얇은 두께 사용
4. 500초가 값이 주어지면, 가장 가까운 숫자의 두꺼운 두께 사용

※ 예를들면  normal과 bold만 지원하는 글꼴일 경우, 100 ~ 500은 normal을 의미하고 600 ~ 900은 bold를 의미한다.