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; } 

影响在sp类元素的任何span子（但不是内后代），太。

P.S.我不知道这些设置可能有用。

Answer 4

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

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

请看下图：在内部跨度 Fiddle