选择后列出的img？

Question

这里的选择器(div.img)选择图像类中的所有div吗？我不明白的是第二个img是什么？我之前做过一些CSS，但我从未遇到过这种语法。

div.img img
{
  display: inline;
  margin: 3px;
  border: 1px solid #ffffff;
}

Answer 1

第二张图片选择<img>个标签内的<div class="img">个标签;空间告诉选择器查看<div>的所有后代元素。

所以，如果我们有

<div class="image">
    <img src="foo.png">
</div>

<img>标记将具有白色边框，3px边距并显示inline。

Answer 2

选择器将匹配<img>元素后代的任何<div>元素与CSS类img。例如，以下<img>标记将与CSS规则匹配

<div class="img">
    <img src="" alt="" /><!-- this img will be matched --> 
</div>

Answer 3

div.img表示div类的名称

所以，如果你有

<div class="img">
<img src="image.gif" alt="" />    
</div>
<div>
<img src="image.gif" alt="" />    
</div>

然后CSS将应用于早期的img元素，但不会应用于后者，因为该元素不在类img的div中。

基本上，该样式将应用于任何img元素，该元素是类img的div元素的后代。