我正在尝试加载仅适用于 ipad 的 css 文件。我试过这个:
<link href="/css/ipad.css" rel="stylesheet" media="all and (max-device-width: 1024px)" type="text/css">
它适用于 iPad,但如果我在桌面上将分辨率降低到 1024 x 768 并在 Firefox 中查看该网站,ipad 样式表也会加载。所以我尝试:
<link href="/css/ipad.css" rel="stylesheet" media="all and (max-device-width: 1024px) and (orientation:landscape)" type="text/css">
但仍然是同样的问题。我如何确保此样式表仅在他们在 iPad 上查看页面时加载?
From:
http://css-tricks.com/snippets/css/ipad-specific-css/ http://css-tricks.com/snippets/css/ipad-specific-css/
这对我来说效果更好。
@media only screen and (device-width: 768px) {
/* 对于一般 iPad 布局 */
}
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
/* 仅适用于纵向布局 */
}
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
/* 仅适用于横向布局 */
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)