我有以下示例 HTML:
<div class="a">
<div>
<ul class="b">
<li class="c">
<input id="123" type="checkbox" checked></input>
<label for="123">test</label>
</li>
<li class="c">
<input id="456" type="checkbox"></input>
<label for="456">test</label>
</li>
</ul>
</div>
</div>
以及以下 CSS:
.a {
text-decoration: line-through;
}
.a .b .c input[type="checkbox"]:not(:checked) + label {
text-decoration: none !important;
}
这可以在这个 JS fiddle 找到:https://jsfiddle.net/4q8a7yox/1/
我想从所有未选中元素的标签中删除划线。奇怪的是,Chrome 控制台将“计算的”文本装饰显示为“无”,但它仍然显示它。所有浏览器(IE10 和 FF)都以类似的方式失败。知道这里发生了什么吗?
最佳答案
根据this question的回答那是不可能的。您不能删除子节点的文本修饰属性。
所以最好的办法是不要将 text-decoration: line-through;
添加到您的 .a 元素,然后尝试将其删除以用于未经检查的输入,而是添加 line-through仅适用于选中的输入。
编辑:试试这个 https://jsfiddle.net/b2bL8ksn/
关于html - 无法从标签中删除文字装饰,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29543519/