覆盖父级的CSS显示属性

Question

我理解如何覆盖父样式,我知道这个例子是人为的,但有没有办法(使用内联CSS)导致子跨度显示,即使它的父设置为不显示？

<span style="display:none">
<span style="display:block;">Test</span>
</span>

Answer 1

不,你不能覆盖display: none内部元素的效果.原因是CSS规范none在display属性值的描述中明确说明:

此值导致元素不出现在格式化结构中(即,在可视媒体中,元素不生成框并且对布局没有影响).后代元素也不会生成任何框; 元素及其内容完全从格式化结构中删除.通过在后代上设置'display'属性,无法覆盖此行为.

Answer 2

简答:不.

答案很长:如果父项被隐藏,则无法覆盖子项中的显示.您可以使用JavaScript从其父级中删除子跨度,并将其放在可应用显示样式的主体中.诸如显示,不透明度,可见性等等,会影响他们应用的元素的子元素,效果无法完全抵消,但对于像不透明度这样的东西,可以添加它们.