嵌套跨度上未禁用CSS直通

时间:2012-05-07 08:27:21

标签: html css

CSS:

ol {
    margin: 0 30px;
}
    li {
        margin: 15px 0;
    }
    li.done {
        text-decoration: line-through;
    }
    li.done span {
        text-decoration: none;
        background: #ff0;
    }

HTML:

<ol>
    <li class="done">Hello <span>World</span></li>
    <li>World</li>
</ol>

JSFiddle演示:http://jsfiddle.net/pZye7/5/。而且JSFiddle上的一些奇怪的东西,有序列表的数字都没有显示出来。

我的要求:“世界”这个词不应该有直线。

1 个答案:

答案 0 :(得分:4)

li.done span {
    text-decoration: none;
    background: #ff0;
    display: inline-block; /* This solved the problem.*/
}

原因:未知