본문 바로가기
Spec UP - Frontend/부스트코스_UI 개발

CSS속성_font-size(폰트사이즈)

by TIS_Ha 2020. 3. 27.
반응형

font-size 속성

속성 값 (기본값:medium : 16px)
1. 키워드 : medium, xx-small, x-small, small, large, x-large, xx-large, smaller, larger

2. length : px, em 등 고정 수치로 지정합니다.

3. % : 부모 요소의 font-size 기준의 퍼센트로 지정합니다.

 

 

absolute size (keyword) 기본 값인 medium에 대한 상대적인 크기로, 브라우저마다 사이즈가 다르게 정의되어있습니다.

relative size (keyword) 부모 요소의 font-size 크기에 대해 상대적입니다. smaller는 0.8배, larger는 1.2배입니다.

length px, em, rem 등의 단위를 이용하여 고정된 크기를 지정할 수 있습니다. - em : 부모 요소의 font-size에 em 값을 곱한 크기 - rem : 루트의 font-size에 rem 값을 곱한 크기

percent (%) 부모 요소의 font-size를 기준으로 백분율 계산된 값을 지정할 수 있습니다.

viewport units vw, vh 단위로 뷰포트를 기준으로 하여, 유동적인 font-size를 지정할 수 있습니다. vw는 뷰포트 width의 1%, vh는 뷰포트 height의 1% 값을 가집니다.

 

https://webclub.tistory.com/122

 

Font Size(Unit 단위) #2

Font Unit (폰트 단위 크기 비교) css에서는 글자 폰트 크기나 width, height 등의 크기를 pt, px, em, ex, % 등의 다양한 단위를 사용할 수가 있다. 대부분 프론트 개발 시에는 px 단위를 사용하고 있지만 요즘..

webclub.tistory.com

문제풀이 : html = 16px

.wrap = 16 * 1.5 = 24

.section = 24 * 1.5 = 36

반응형

댓글