Heim >Web-Frontend >HTML-Tutorial >iPhone的CSS3媒体查询_html/css_WEB-ITnose

iPhone的CSS3媒体查询_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:49:26896Durchsuche

iPhone的CSS3媒体查询:

  各版本的iPhone媒体查询是根据其分辨率和一些CSS3媒体查询的特性来实现媒体查询的...详见下:

 

iPhone6的媒体查询:

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : portrait) {/*iPhone 6 Portrait*/}@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : landscape) {/*iPhone 6 landscape*/}@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : portrait) {/*iPhone 6+ Portrait*/}@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : landscape) {/*iPhone 6+ landscape*/}@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px){/*iPhone 6 and iPhone 6+ portrait and landscape*/}@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) and (orientation : portrait){/*iPhone 6 and iPhone 6+ portrait*/}@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) and (orientation : landscape){/*iPhone 6 and iPhone 6+ landscape*/

引用自:iPhone6的CSS3媒体查询


各手机端版本分辨率与CSS中的实际分辨率对照区别表格:

引用自:mydevice.io

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn