CSS类合并

Question

有人可以解释这个问题吗？预期的结果似乎没有发生......我的假设是否正确？

.float-right{
  float:right;
}

.header{
   (stuff we don't care about)
}

.header img .float-right {
  display:inline;
  margin:0 0 0 0.5em;
}

我 THOUGHT 这意味着＆lt; img＆gt;标签里面＆lt; div class =“header”＆gt;会得到：

float:right;
display:inline;
margin:0 0 0 0.5em;

IF ＆lt; img＆gt; tag是class =“float-right”

这是对的吗？

Answer 1

要获得所需的结果，它应该是

.header img.float-right

（没有空格）

Answer 2

没有。 .header img .float-right表示具有float-right类的任何标记，该标记是img标记的后代，而img标记又是带有标题类的标记的后代。

Answer 3

  

如果＆lt; img＆gt; tag是class =“float-right”

要实现没有空间

 .header img.float-right {

就像现在一样，它正在寻找

 [an element with class "float-right"] [inside an img] [inside an element with class header]

Answer 4

如果你在样式表中删除了img和.float-right之间的空格，那将会发生什么。