检测CSS中的浏览器窗口方向

检测CSS中的浏览器窗口方向,css,Css,我希望我的网站布局如下横向: +------------+---------------------+ | Header | | | | Content | | Navigation | | +------------+---------------------+ +---------------------+ | Header | +

我希望我的网站布局如下横向:

+------------+---------------------+
| Header     |                     |
|            |        Content      |
| Navigation |                     |
+------------+---------------------+
+---------------------+
|        Header       |
+---------------------|
|                     |
|        Content      |
|                     |
+---------------------+
|      Navigation     |
+---------------------+
在纵向方向上是这样的:

+------------+---------------------+
| Header     |                     |
|            |        Content      |
| Navigation |                     |
+------------+---------------------+
+---------------------+
|        Header       |
+---------------------|
|                     |
|        Content      |
|                     |
+---------------------+
|      Navigation     |
+---------------------+
我怎样才能做到这一点

我知道有一些实验性的方法来管理屏幕方向,但它们没有得到广泛的实施,因此对我没有任何用处


我也知道这里有很多类似的问题,但它们都是针对不同的屏幕大小,我不希望这样。我只想可靠地检测当前最常见的浏览器的方向,独立于屏幕大小,并且不使用JavaScript。也就是说,调整为横向的桌面浏览器窗口的渲染效果应与手持移动设备的横向渲染效果相同,与实际像素宽度无关。

您应该使用css媒体查询。是的,Roko是对的,css媒体查询不再是实验性的,大多数浏览器都支持它。确保支持是普遍的

关于如何使用,css媒体查询与定位,其已得到回答。寻找答案


有关CSS媒体查询的更多信息,请参阅文档。

您不能,就这么简单。在您的问题中,您排除了所有可能让您检测窗口方向的技术。

所以您想要一种非Javascript、可靠的方法来检测方向,而不使用CSS3?欢迎来到2015<代码>媒体查询不再是实验性的:)(从我个人的角度来看)@chipChocolate.py IE8。。。好的,我同意你的看法。但现在的问题是:我们是否需要在IE8上控制
横向/纵向
问题是,我的目标不仅仅是移动设备。虽然我的sit有大约50%的移动访客,但我仍然有大约15%的人使用IE<9。@还有什么比帮助我们杀死IE8并付诸行动更好的呢!(转到
媒体查询
)该代码是否意味着
@media
-CSS会被不支持
@media
-查询的浏览器忽略,或者他们会一直应用它?别忘了在回答中添加
-vendor-
前缀(例如:
-ms-
-webkit-
)如果浏览器不支持css媒体查询,则该查询将被忽略。具体来说,在您的情况下,IE8不支持CSS媒体查询。如果您真的必须支持IE8,这个堆栈溢出链接将讨论其他选择。这不是一个解决方案,但它很好地回答了这个问题。