1. media query -> 반응형에 사용
CSS 파일 최하단에 적음!!
여러개 써도 됨
// 현재 브라우저 폭이 1200px이하면 font-size를 30px로
@media screen and (max-width: 1200px){
.main-title {
font-size: 30px;
}
}
2. media query 쓸 때 다른 사람들이 많이 쓰는 breakpoint 기준 px값을 사용하는 게 좋음
1200px
992px
768px
576px
단위를 많이 사용함
보통 breakpoint는 3개정도, 많으면 4개 정도가 적당함.
너무 많으면 복잡하고 관리도 어려움.
3. CSS 덮어쓰기
1) 그냥 같은 클래스명 하단에 쓰기
2) 우선순위 높이기
3) specificity 높이기
반응형
'Knowledge Wiki > HTML&CSS' 카테고리의 다른 글
[ HTML/CSS ] transition-timing-function (0) | 2021.12.08 |
---|---|
[ HTML/CSS ] 크롬, IE 개발자 도구 활용법 (0) | 2021.12.08 |
[ HTML/CSS ] 반응형 웹 단위 - vw, vh, rem, em (0) | 2021.12.08 |
[ HTML/CSS ] 제목 아이콘 커스터마이징 - favicon (0) | 2021.12.08 |
[ HTML/CSS ] 폰트 (0) | 2021.12.08 |