Dev/HTML&CSS
[CSS] @media
yujin.me
2021. 5. 17. 21:38
다양한 미디어 유형이나 장치에 따라 서로 다른 스타일 규칙을 적용
@media 미디어타입 and(미디어특성) {
CSS코드
}
미디어타입
타입 | 의미 | 기본값 |
all | 모든 미디어 타입에 적용 | all |
screen | 컴퓨터화면, 타블렛, 스마트폰 등 볼 수 있는 모니터 화면이 있는 디바이스 | |
인쇄 전용 |
미디어특성
특성 | 의미 |
width | 뷰포트 가로 너비 |
max-width | 뷰포트 최대 가로 너비(이하) |
min-width | 뷰포트 최소 가로 너비(이상) |
height | 뷰포트 세로 너비 |
max-height | 뷰포트 최대 세로 높이 |
min-height | 뷰포트 최소 세로 높이 |
orientation | 뷰포트 방향(portrait, landscape) |
반응형