관리 메뉴

KorSA

[ HTML/CSS ] 반응형 웹 단위 - vw, vh, rem, em 본문

Knowledge Wiki/HTML&CSS

[ HTML/CSS ] 반응형 웹 단위 - vw, vh, rem, em

Praiv. 2021. 12. 8. 18:23
320x100

1. 반응형 웹 만들땐 vw, vh 유용함
    vw -> 브라우저 폭에 비례
    vh -> 브라우저 높이에 비례
    rem -> 기본 폰트사이즈에 비례, 처음 기준으로 1rem == 16px

.font {
	font-size: 1rem;
}


2. 모든 단위를 rem으로 맞추면 폰트 크기가 늘거나 줄때에 레이아웃이 덜 깨짐
    But, 요즘엔 그냥 ctrl 누르고 화면 크기 키우니까 많이 쓰진 않음..
    그래도 typography 디자인 할때는 rem을 쓰면 유용함

3. em 단위 -> 내 폰트 사이즈의 X배
    em도 많이 쓰진 않음

728x90
728x90
Comments