0

在此图片库示例中:

http://www.w3schools.com/css/tryit.asp?filename=trycss_float_elements

<head>
<style>
.thumbnail 
{
     float:left;
     width:110px;
     height:90px;
     margin:5px;
}
</style>
</head>

<body>
<h3>Image Gallery</h3>
<p>Try resizing the window to see what happens when the images does not have enough    room.</p>
<img class="thumbnail" src="klematis3_small.jpg" width="116" height="90">
<img class="thumbnail" src="klematis4_small.jpg" width="120" height="90">
</body>
</html>

如果从 .thumbnail 类中删除宽度,则图像将彼此相邻放置,中间没有空格。但是对于没有浮动的常规图像元素,似乎自动有一些边距。我需要了解一般行为。浮动的行为是它们彼此相邻放置。为什么会影响图像元素的边距?

谢谢你的帮助。

4

2 回答 2

1

只有块元素可以有边距。

添加:

display:block到你的 CSS

于 2013-03-25T17:06:33.767 回答
0

每个图像都有自己的宽度大小。如果您没有在类中设置宽度大小,则图像将无法很好地对齐。如果您在类中声明宽度,就像您为该图像创建一个容器,无论该图像的宽度是多少,它都会相应地调整为 110 像素。是的,浮动会将所有图像彼此对齐。

于 2013-03-25T19:02:16.973 回答