화면 해상도, 기기 방향 등의 조건으로 HTML에 적용하는 스타일을 전환할 수 있는 CSS3 속성 중 하나
@media(조건){
스타일
}기본 문법
@media [only 또는 not] [미디어 유형] [and 또는 ,] (조건문){실행문}실습
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
<style>
@media screen and (max-width: 600px) {
div {
background-color: lightblue;
}
}
@media screen and (min-width: 600px) {
div {
background-color: lightcoral;
}
}
div {
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>
