EnJinnier
[CSS] 크기단위 본문
절대적인 크기 단위
픽셀 px
화면을 표시하는 기준이 되는 크기
상대적인 크기 단위
퍼센트 %
부모 태그의 크기에 상대적으로 지정할 때 사용.
예를 들어 부모 태그의 height의 절반 값을 쓰고 싶다면, height: 50% 처럼 쓸 수 있음
#parent {
background-color: #A655ED;
height: 320px;
}
#child {
background-color: #6942D6;
height: 50%;
}
em
1em은 부모 태그의 font-size 크기임.
예를 들어 부모 태그 글자 크기의 4배를 하고 싶다면 4em이라고 쓰면 됨
#parent {
font-size: 16px;
}
#child {
font-size: 4em; //실제로 16*4=64px이 되는 것
}
rem
1rem은 최상위태그(=html태그)의 font-size 크기가 됨.
예를 들어 <html> 태그 글자 크기의 2배를 하고 싶다면 2rem이라고 쓰면 됨.
html {
font-size: 16px;
}
body {
font-size: 18px;
}
#other {
font-size: 2rem;
}'웹 개발 > CSS' 카테고리의 다른 글
| [CSS] Flexbox Froggy : Css Flexbox 학습 게임 (0) | 2024.03.27 |
|---|---|
| [CSS] 배경이미지 설정 및 그라디언트(그라데이션) 넣기 (0) | 2024.03.26 |
| [CSS] 색상 표현법 4가지 (0) | 2024.03.25 |
| [CSS] CSS 관련 지식 - 1 (기본 개념) (0) | 2024.02.13 |
| [CSS] 뉴스레터페이지 만들기-3 (색상, 글꼴, 여백 설정) (0) | 2024.02.10 |
'웹 개발/CSS' Related Articles
more
