我正在开发一个适用于智能手机的网站,并且在处理智能手机横向方向的媒体查询时遇到了一点问题。对于竖向方向,我使用了以下媒体查询,效果非常好:
@media only screen and (max-width : 320px) { 样式在这里 }
但是,当我将此媒体查询用于横向方向时(从css-tricks.com中获取),我编写的横向方向的样式会覆盖我在桌面版网站上设置的样式。
@media only screen and (min-width : 321px) { 样式在这里 }
只有在我为横向方向分配样式时才会发生这种情况,当我为竖向方向分配样式时不会出现这种情况。
P.S 我在 iPhone 4 上进行测试。