iPhone 및 Android와 같은 모바일 브라우저에 맞게 CSS를 특별히 사용자 정의하려고 할 때 다음 사항에 유의해야 합니다. @media 핸드헬드의 한계. 이 미디어 쿼리 유형은 과거에 사용되었지만 모바일 장치, 특히 고급 디스플레이 기능이 있는 장치에서는 보편적으로 지원되지 않습니다.
원하는 효과를 얻으려면 대체 접근 방식을 고려하십시오.
@media 휴대용 대신 @media 화면 쿼리를 사용하세요. 이러한 쿼리를 사용하면 해상도, 장치 너비 등 특정 화면 특성을 기반으로 장치를 타겟팅할 수 있습니다. 예를 들어, iPhone용 웹페이지 스타일을 지정하려면
@media screen and (max-device-width: 480px) { body { color: red; } }
또는 CSS 기능 쿼리를 사용하여 특정 브라우저 기능을 감지할 수 있습니다. 예를 들어, 미디어 쿼리가 지원되는지 확인하려면:
@supports (media) { /* Styles to be applied if media queries are supported */ }
특정 해상도를 가진 장치를 타겟팅하려면 @media 쿼리를 해상도 미디어 기능과 결합할 수 있습니다.
@media screen and (max-device-width: 480px) and (resolution: 163dpi) { body { color: blue; } }
위 내용은 @media 핸드헬드가 모바일 CSS를 위한 안정적인 솔루션이 아닌 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!