<分区>
以下代码显示了两个嵌套列表。外面一个带有 text-decoration:line-through 属性，另一个没有 line-through 。我怎样才能删除这个内线直通或首先不应用它？!!我想在“外部”而不是“内部”这个词上划线
<DOCTYPE html>
<header><style>
ol li {text-decoration:line-through; color:red;}
ol li ul li{text-decoration:none; color:pink;}
</style></header>
<body>
<ol>
<li>Outter
<ul>
<li>
Inner
</li>
</ul>
</li>
</ol>
</body>
最佳答案
您可以使用 display: inline-block 来避免父级的 text-decoration 影响其子级。
之所以有效，是因为根据 specs ,
When specified on or propagated to an inline element, it affects all the boxes generated by that element, and is further propagated to any in-flow block-level boxes that split the inline (see section 9.2.1.1). But, in CSS 2.1, it is undefined whether the decoration propagates into block-level tables. For block containers that establish an inline formatting context, the decorations are propagated to an anonymous inline element that wraps all the in-flow inline-level children of the block container. For all other elements it is propagated to any in-flow children. Note that text decorations are not propagated to floating and absolutely positioned descendants, nor to the contents of atomic inline-level descendants such as inline blocks and inline tables.
关于html - 无法在子列表中删除直通线，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19529100/