iPhone / iPad上的CSS元素(带有精灵)无法正确缩放
||
我的主页上有一个列表,每个列表都有一个链接。每个列表项都有不同的高度和宽度,就像页面上的块一样。每个列表项内都有一个指向我这一侧其他区域的链接。此列表周围是一个容器div,与大多数网站一样,其页眉和页脚也是如此。 ul还对图像使用CSS精灵,因此普通图片仅是图片高度的一半,底部是其他图片精灵。
由于某种原因,iphone / ipad上的不能正确缩放,实际上我似乎从左到右重复了背景,并且高度没有得到保持,因此您可以看到该精灵的其他图像。如果在背景上设置不重复,则只填充容器div的一半,并且在飞溅部分的右侧有一个很大的白色间隙,并且其他精灵仍然在底部显示。
我尝试将的宽度和高度更改为更大,也尝试将div的宽度和高度固定为相同的固定高度和宽度。当使用iphone / ipad时,我也尝试添加\'\'标签。没有任何改变。似乎无序列表只是不想填写到容器中。
<style media=\"screen\">
#main{
width: 985px;
height: 1078px;
background: url(../images/main.jpg);
margin: 0px;
padding: 0;
position: relative;
}
#main li {
margin: 0;
padding: 0;
list-style: none;
}
#mainSection1 a { left: 642px; width: 193px; top: 282px; height: 18px; position: absolute; }
#mainSection1 a:hover { background: url(../images/main.jpg) -642px -1360px; }
/* ... and so forth */
</style>
<ul id=\"main\">
<li=\"mainSection1\"><a href=\"anotherpage></a></li>
<!-- there are 8 other list items here repeating the same -->
</ul>
没有找到相关结果
已邀请:
1 个回复
雄鞋谋塘