0

我真的在为我的网站主页而苦苦挣扎。

显示动画和交互、网页设计、印刷设计和插图的图像在我的计算机上看起来不错，但是当我在 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;
}
4

1 回答 1

0

我不确定您要实现什么，但我相信您的问题主要来自您的一些min-width和max-width在调整大小时限制页面的属性。

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

您还应该确保没有为图像设置固定大小（在 CSS 或 HTML 文档中）。相反，使用img { max-width: 100%; }.

希望能帮助到你。

于 2012-07-31T12:30:53.613 回答