0

作为示例,我正在尝试创建缩略图,但应用了下面列出的自动 img css

img, img a {
border: none;
  margin-top:10px;
  margin-bottom:10px;
}

由于某种原因,我无法在脑海中理解它。我知道语法可能很简单,但我似乎不记得了。谢谢克里斯

4

2 回答 2

1

您不能为图像添加边距的原因是因为 img 元素默认情况下是内联的。这意味着您不能为它们提供尺寸,或者从底部或顶部添加边距(以及您可能应该阅读的其他一些内容)。

这意味着为了给 img 元素提供顶部或底部的边距,您需要将其声明为块,或者更确切地说是 inline-block。这是使用

img { display: inline-block; }

然后你可以加上你的利润和中提琴:

img { 
    display: inline-block;
    margin: 10px 0; }
于 2012-10-28T00:58:08.437 回答
0

您是否尝试以某种方式设置所有图像的样式,然后排除某个容器 div 中的图像?如果您的容器 div 被称为#wrapper,那么执行以下操作:

#wrapper img,
#wrapper a img /* assuming that's what you meant rather than img a */
{
  /* undo what you did above for images inside #wrapper */
  margin-top: 0;   margin-bottom: 0;
}

img 的这种松散选择器可能会很麻烦,因为图像一直在不同的上下文中使用。我更喜欢仅对#content div 或类似内容中的图像进行样式设置。

于 2012-10-27T23:08:08.773 回答