图像在设备上不缩放

说我的电脑上动画和交互式，网页设计，印刷设计和插图看起来不错的图像，但当我在我的iPad上看我的网站时，它们不能正确缩放。

这里是CSS：

#content { 
    position: relative; 
    color: #333; 
    width:100%; 
    min-width: 900px; 
    border:none; 
    background: none; 
    overflow:auto; 
    padding-right:32px; 
    padding-left:32px; 
    padding-bottom: 86px; 
} 
#slideshow { 
    position:relative; 
    height:462px; 
    z-index:-1; 
} 
#slideshow IMG { 
    position:absolute; 
    top:0; 
    left:0; 
    z-index:8; 
} 
#slideshow IMG.active { 
    z-index:10; 
} 
#slideshow IMG.last-active { 
    z-index:9; 
} 
#rightholder { 
    float: right; 
    clear: left; 
    max-width: 639px; 
    width: 60%; 
    padding-top: 90px; 
    z-index:11; 
} 
.right { 
    float:right; 
    margin-bottom:20px; 
    max-width: 50%; 
    z-index:13; 
} 
.left{ 
    float:left; 
    margin-bottom:20px; 
    max-width: 50%; 
    z-index:12; 
}

来源

2012-07-31 LaurenWomack

你是什么意思，他们不在iPad上扩展？他们没有css来让他们扩大规模。 – Luca 2012-07-31 09:18:43

他们都是固定尺寸的图像，所以他们不会。你想在CSS中设置尺寸。 – SpaceBeers 2012-07-31 09:19:39

我在html中定义了尺寸，我会尝试在CSS中进行。谢谢这里的HTML： – LaurenWomack 2012-07-31 09:22:00

我不知道你想实现什么，但我相信调整当你的问题主要来自你的一些min-width和max-width性质约束页面。

如果您使用灵活的单位，您应该尽量让布局尽可能流畅。我猜你正在使用这些属性来防止奇怪的行为，因为您应该使用media queries来使您的设计适应各种分辨率。

您还应该确保不要为图片设置固定尺寸（无论是在CSS还是HTML文档中）。相反，使用img { max-width: 100%; }。

希望它有帮助。

来源

2012-07-31 12:30:53 morgi

图像在设备上不缩放

回答

相关问题