css根据纵向或横向屏幕尺寸进行扩展？

小编典典

css根据纵向或横向屏幕尺寸进行扩展？

css

我有两个div彼此相邻浮动。我想要的是在纵向模式下查看时具有100px的宽度，在横向上可以说200 px。这实际上发生在移动设备上。

因此，在横向模式下，div会扩大，在纵向模式下会略微缩小。

有任何想法吗？

阅读 439

2020-05-16

共1个答案

小编典典

好吧，这在CSS2中是不可能的，但是可以使用Javascript做你想做的事情（读出屏幕尺寸等）。

我不确定您正在研究什么技术，但是CSS3正是CSS3 MediaQueries提供了您想要的东西。

使用CSS3，您会得到一些有趣的东西（或者甚至可以指定宽度，例如200px）：

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

请查看此示例页面，以获取更多说明或此说明。

编辑
只是因为我今天找到了此页面：精制CSS3媒体查询

2020-05-16