CSS - @media

@media

1) @media 란?

• CSS에서 사용되는 규칙 중 하나로, 미디어 쿼리를 정의할 때 사용

• 미디어 쿼리는 사용자의 디바이스 특성에 따라 스타일을 적용하거나 변경할 수 있게 해줌

• 반응형 웹 디자인을 구현하거나, 특정 디바이스에 맞게 스타일을 조정할 수 있음

2) @ media 예시

💡 화면 너비가 600px 이상일 때 스타일 적용

@media screen and (max-width:600px) {
	/* 스타일 정의 */
}

💡 화면 너비가 600px 이상, 900px 이하일 때 스타일 적용

@media screen and (min-width:600px) and (max-width:900px) {
	/* 스타일 정의 */
}

💡 화면 너비가 900px 이하일 때 스타일 적용

@media screen and (min-width:900px) {
	/* 스타일 정의 */
}