Question

样品：

<!DOCTYPE html>
<html>
<head>
<title></title>
   <style type="text/css">
    div {display:inline-block; height:200px; overflow-x:hidden; overflow-y:auto;}
        a {display:block;}
    img {border:0;}
   </style>
</head>
<body>
   <div>
    <a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
    <a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
    <a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
    <a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
    <a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
   </div>
</body>
</html>

如您所见，图像的右侧部分被剪切。我知道我可以估计滚动条的宽度并给div一个固定的宽度，但我想知道是否有更好的方法。

Answer 1

因为没有重置css，为什么它可能会出问题

但您可以尝试在div上添加css属性

div{padding-right: 25px;}

它可能输出更好

滚动条剪切图像

1 个答案: