테스트 사이트 - 개발 중인 베타 버전입니다

이게 같은코드인가요?

mintyday 6개월 전 조회 1,093

안녕하세요~
1,2를 써도 같은 결과 인듯한데,

유튜브 영상을 보니 2번으로 쓰길래..
갑자기 의문점이 생겨서 질문 드립니다.
1번과 2번은 결과적으로 같은 코드 맞나요?

1.
@media  (max-width:768px){

}
2.
@media screen and (max-width:768px){

}

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

6개월 전

핵심적인 차이는 적용 범위입니다.

 

첫 번째는 미디어 타입을 명시하지 않아 모든 장치(화면, 인쇄물, 스크린 리더 등)에 적용되는 반면, 두 번째는 오직 화면 디스플레이에만 적용됩니다.

 

일반적인 웹 개발에서는 `@media screen and (max-width:768px)` 형태를 더 많이 사용합니다.

 

이는 대부분의 개발자들이 화면 디스플레이에 최적화된 작업을 주로 하기 때문입니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

6개월 전

결과론적으로 같은건 맞습니다.

 

1. 생략 시 기본 디폴트 값인 all 로 적용 됩니다.

 

2. 당연히 screen 적용 시 스크린만 적용 됩니다.

 

3. 올의 경우는 스크린과 프린트가 적용 됩니다.

 

아래를 참조 하세요

 

https://www.w3schools.com/cssref/atrule_media.php

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인