가로 및 세로 모드에서 특정 항목을 표시하는 CSS 미디어 쿼리

Question

아이폰 5 (세로 폭 374px 이하)로 표시하고 싶지 않은 페이지에 div가 있습니다. 그러나 가로로 회전하면 div가 표시됩니다. 화면에 세로 모드에서 최대 너비가 374px 인 경우 lanscape 모드에서도 css를 적용하는 미디어 쿼리를 작성할 수 있습니까?

Answer 1

아이폰 5는 그래서 당신과 같이이 orientation와 정보와 max-device-width을 사용할 수 있습니다 568px의 가로 폭 :

이

@media screen and (max-width: 374px), 
     screen 
     and (max-device-width: 568px) 
     and (orientation: landscape) { 

    /* styles here for iphone 5 landscape + any screen below 374px */ 
    .hide-content-iphone5 { 
     display: none; 
    } 
} 

"또는"미디어 쿼리 의미의 쉼표 - 그래서 화면을 캡처하는 374px보다 작거나 최대 장치 너비가 568px이며 가로 방향입니다.