如果您在iPad上访问http://eastcoworldwide.com/Proofs/mint/index.html,请单击第1章>第1章>开始使用...您将在加载屏幕后看到第1章页面.
基本上这是什么,是html嵌入到由html 5和javascript拉到一起的iframe中.这个iframe中的html调用自己的名为other.css的css表.把这一切拉到一起的html文件就是调用一个名为styles.css的样式表.
显然,我希望在纵向视图中,此iframe的内容区域小于横向.我在other.css中使用css:
@media only screen and (device-width: 768px) and (orientation:landscape) {
#content {background:green;}
}
@media only screen and (device-width: 768px) and (orientation:portrait) {
#content {background:blue;}
}
问题是,它甚至没有看到肖像css.我已经尝试了十几种不同的方式(这应该是正确的方式,并适用于整个页面的styles.css调整)但它不会识别它.它只会使用景观.它不像它不会看到媒体查询,它拉动景观css.但不会使用肖像.真的很奇怪.如果你看到绿色的bg在纵向和横向,它忽略了肖像.如果你看到蓝色它的工作,请帮忙!
顺便说一句,如果我摆脱了风景css,它更喜欢画面的默认设置.没有意义.iframe是否会阻碍其在定位改变时拉入新的css？