css – 如何只删除下划线从:之前

前端之家收集整理的这篇文章主要介绍了css – 如何只删除下划线从:之前前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一组样式链接使用:之前应用箭头。

它在所有的浏览器看起来不错,但当我应用下划线的链接,我不想有下划线:前部分(箭头)。

参见jsfiddle例如:http://jsfiddle.net/r42e5/1/

是否可以删除这个?测试样式我坐了#test p a:hover:before应用(根据Firebug),但是下划线仍然存在。

任何方式,以避免这一点?

解决方法

Is it possible to remove this?

是,如果将内联元素的显示样式从display:inline(默认)更改为display:inline-block:

#test p a:before {
    color: #B2B2B2;
    content: "► ";
    display:inline-block;
}

这是因为the CSS specs say

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). […] 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.

(强调我。)

演示:http://jsfiddle.net/r42e5/10/

感谢@Oriol提供了解决方法提示我检查规格,并看到解决方法是合法的。

猜你在找的CSS相关文章