모바일에서 미디어쿼리 사이즈 부분 질문드립니다. 채택완료
@media all and (max-width:1300px) @media all and (max-width:1200px) @media all and (max-width:1100px) @media screen and (max-width: 768px) @media screen and (max-width:640px) @media screen and (max-width: 480px) @media screen and (max-width: 360px)
@media all and (max-width:1200px) @media all and (max-width:1100px) @media all and (max-width:768px)
여기서 굳이 작업하지 않아도 되는 사이즈가 있나요? 그리고 screen과 all의 차이점을 알고싶습니다.
답변 2개
클라이언트의 요청에 따라 다르겠지만 일반적으로 아래와 같은 브레이크포인트 만으로도 반응형을 구현할 수 있습니다. @media all and (max-width: 1200px) @media all and (max-width: 1024px) @media screen and (max-width: 768px) @media screen and (max-width: 640px) @media screen and (max-width: 480px) @media screen and (max-width: 360px)
screen은 화면에 표시되는 스타일(모니터, 모바일기기, 태블릿)에서 사용하는 스타일이고, all은 화면과 상관없이 모든 출력장치(screen기기, 인쇄 등)에서 사용하는 스타일입니다. 따로 인쇄용 스타일을 지정하지 않는다면 screen을 사용하시면 됩니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인