如何使用CSS确定设备是竖屏模式还是横屏模式

Question

为了确定屏幕大小，我使用媒体查询（media queries），但是我想要使用CSS确定设备是处于横屏还是竖屏模式，以便根据屏幕大小设置不同的背景图像。

您有什么想法吗？

- Mayank Sharma

Answer 1

简单地为横向和纵向模式编写媒体查询：

/* Portrait */
@media screen and (orientation:portrait) {
/* Portrait styles */
}
/* Landscape */
@media screen and (orientation:landscape) {
/* Landscape styles */
}

点击此处链接

- user2377971

---

在HTML5中，media screen变成了media all，请参见：https://dev59.com/nWcs5IYBdhLWcg3w0HSz - jpoppe