我正在尝试使用CSS3子组合器(>
)将div的任何子项设置为max-width: 100%;
。结合box-sizing:border-box;
,我试图设置它,以便div的任何内容永远不会大于包含div。
* {
box-sizing: inherit;
}
html {
box-sizing: border-box;
}
div > * {
max-width: 100%;
}
现在我在div中有一个图像:
<div style="width: 70%;">
<img src="foo" width="750" height="200" />
</div>
如果750像素宽于div的70%宽度,则图像会突破div。如果我将CSS更改为:
div > img {
max-width: 100%;
}
...然后图像缩小以适应div(这就是我想要的)。我在这里错过了什么?是否存在通配符*
在这种情况下无效的已知问题?