미디어쿼리 질문합니다. 채택완료
안녕하세요
아이폰 6S, XS, XR 크기를 맞추려고 합니다.
우선 6S px 크기는 아래 캡쳐와 같습니다.
W PX 750 이더라구요
그래서 미디어 쿼리르 아래와 같이 만들었습니다.
@media (min-width: 700px) and (max-width: 760px) { }

아이폰 X, XS, XR 픽셀 크기는 아래와 같습니다.
아래와 같이 가장 큰 width값이 1125px 가장 작은 width값이 828px입니다.
따라서 아래와 같이 만들었습니다.
@media (min-width: 828px) and (max-width: 1125px) { }

그런데 실행을 하면 모두 아이폰 6s 미디어쿼리만 타고있습니다. 무엇이 잘못된건가요?
제가 미디어쿼리를 제대로 이해를 못하는건지..ㅠ min-width 와 max-width를 잘못한건지 궁금합니다.
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
6년 전
max는 그 이하일때, min은 그 이상일때. 입니다.
위에 말씀주신 @media (min-width: 700px) and (max-width: 760px) { } 은
700px 보다 크고 760px 보다 작을때 입니다.
사이즈가 가장 큰것부터 max-width 만 써서
나열해보시면 답이 나올것 같습니다~
두번째 말씀주신것으로 만들어보면 이렇습니다.
</p>
<p>@media (max-width: 1125px) {</p>
<p> // 가로사이즈가 <span style="color:#e74c3c;">1125px 이하</span>일때 (X, Xs)</p>
<p>}</p>
<p>@media (max-width: 828px) {</p>
<p> // 가로사이즈가 <span style="color:#e74c3c;">828px 이하</span>일때 (Xr)</p>
<p>}</p>
<p>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인전체 질문 목록
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
답변대기
채택
답변대기
답변대기
답변대기
답변대기
채택
채택
답변대기
답변대기
답변대기
채택