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

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

- 编辑 -

.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>

来源

2011-04-03 oneat

图像的大小是如何指定的？ – Oded 2011-04-03 18:22:59

用于应用样式的选择器是否与'img'匹配？ – David 2011-04-03 18:24:15

这是级联的，但宽度和高度不能被继承。

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

像

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

来源

2011-04-03 18:23:38 kapa

我有一个问题：图像何时需要**父元素**的100％，什么时候需要**页**的100％？ – JCOC611 2011-04-03 18:27:19

我觉得当页面是屏幕元素或定位是绝对 – oneat 2011-04-03 19:06:45

<img>标签要么图像的自然宽度，或者必须用CSS来重写标签的width属性的隐式宽度。试试这个，使其父<div>的宽度图像100％：

div img{ 
    width: 100%; 
}

我觉得你有一点什么级联实际上是一种误解。我建议你阅读part of the spec that deals with the cascade。

来源

2011-04-03 18:24:18

这种方法是最好的，因为它会保留图像的比例。 – jackJoe 2011-04-03 18:28:33

您的样式选择器只匹配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>

来源

2011-04-03 18:27:13 David

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

回答

相关问题