基于移动方向的图像高度答案

【问题标题】：image height based on mobile orientation基于移动方向的图像高度
【发布时间】：2012-05-12 21:28:16
【问题描述】：

我在使用小型移动图片库时遇到了问题。当我将方向更改为纵向时，图像太大而无法在屏幕上显示。

当方向变为纵向时，是否可以使用一些 javascript 使图像适合屏幕？
在横向模式下，一切看起来都很好。

【问题讨论】：

标签： javascript jquery mobile orientation image-scaling

【解决方案1】：

是的，您可以在不使用 JavaScript 的情况下使用 CSS3 Media Queries。

@media screen and (max-width: 450px) {
    img {
        width: 30%;
    }
}

http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

【讨论】：

【解决方案2】：

试试这个：

@media screen and (orientation:portrait) {
    //your css code goes here
}

@media screen and (orientation:landscape) {
    //your css code goes here
}

【讨论】：