Question

为什么当我想调整div时，div中的图像不会改变它的大小！这是CASCADE样式表，不是吗？

- 编辑 -

.box{padding:0px;margin-left:10px;display:inline-block;margin-right:auto;width:20px;height:20px;border:1px solid red;}

<div class="box">
<img src="larrow.gif"/>
</div>

Answer 1

它是级联的，但宽度和高度不会被继承。

您可能想要做一些事情来使图像遵循其父级的大小。

喜欢

div.box img { width: 100%; height: 100%; }

Answer 2

<img>标记的隐式宽度为图像的自然宽度或标记的width属性，必须用css覆盖。尝试将图像设为其父<div>宽度的100％：

div img{
    width: 100%;
}

我认为你对级联实际上有什么误解。我建议您阅读part of the spec that deals with the cascade。

Answer 3

您的样式选择器仅匹配具有类box的元素。 div有该类，但img没有。因此，div已应用样式而img未应用。尝试：

.box
{
  padding:0px;
  margin-left:10px;
  display:inline-block;
  margin-right:auto;
  border:1px solid red;
}
.box, .box img
{
  width:20px;
  height:20px;
}

<div class="box">
  <img src="larrow.gif"/>
</div>

CSS和图像 - 为什么图片没有调整大小

3 个答案: