이게 같은코드인가요?
본문
안녕하세요~
1,2를 써도 같은 결과 인듯한데,
유튜브 영상을 보니 2번으로 쓰길래..
갑자기 의문점이 생겨서 질문 드립니다.
1번과 2번은 결과적으로 같은 코드 맞나요?
1.
@media (max-width:768px){
}
2.
@media screen and (max-width:768px){
}
답변 2
결과론적으로 같은건 맞습니다.
1. 생략 시 기본 디폴트 값인 all 로 적용 됩니다.
2. 당연히 screen 적용 시 스크린만 적용 됩니다.
3. 올의 경우는 스크린과 프린트가 적용 됩니다.
아래를 참조 하세요
핵심적인 차이는 적용 범위입니다.
첫 번째는 미디어 타입을 명시하지 않아 모든 장치(화면, 인쇄물, 스크린 리더 등)에 적용되는 반면, 두 번째는 오직 화면 디스플레이에만 적용됩니다.
일반적인 웹 개발에서는 `@media screen and (max-width:768px)` 형태를 더 많이 사용합니다.
이는 대부분의 개발자들이 화면 디스플레이에 최적화된 작업을 주로 하기 때문입니다.
답변을 작성하시기 전에 로그인 해주세요.