SPAN不继承财产

Question

请告知什么是问题。

<style>
 .sp{display:table-cell;}
</style>

然后

<span class="sp">
 test
 <span>
  test1
 </span>
</span>

我使用chrome检查器查看两个跨度，并看到外部是一个单元格，但内部不继承此属性...我缺少什么？

Answer 1

请从此更改

<style>
 .sp{display:table-cell;}
</style>

进入

<style>
 span{display:table-cell;}
</style>

Answer 2

display的子元素不会自动继承span属性。您期望此样式将由嵌套标记继承，这是不正确的，并且与规范不一致。

请参阅：the MDN documentation for the display property。

以下CSS样式将实现您的目标：

.sp, .sp>span{display:table-cell;}

Answer 3

根据其定义，display property不会被继承。如果是的话，实际上会有相当大的问题。

因此，该规则仅影响类sp中的此类元素。

要使其影响内部span，您也可以在其上设置class=sp。或者，您可以使用例如

.sp, .sp > span {display: table-cell; }

也影响类span中元素的任何sp子（但不是内部后代）。

P.S。我不知道这些设置对什么有用。

Answer 4

我不确切知道为什么，但有些属性不能像那样继承。 但试试这个，看看我在说什么：

.sp, .sp span {
    display:table-cell;
}

看看： 的 Fiddle