我试图让它看起来漂亮,但我遇到了一个问题.我有一个span元素,在anchor标记内包含一个Subtitle或简短描述.不幸的是,它的样式与锚点相同,这不是我想要的样子.我已经尝试将样式应用于跨度本身但它们似乎被锚样式覆盖.问题是当链接悬停时我不希望它被加下划线.
这是我的HTML.
还有我的CSS
#leftNav ul li { position: relative; }
#leftNav ul li a span.subTitle
{
bottom: 4px;
color: #000000;
display: block;
font-size: 12px;
left: 10px;
position: absolute;
text-decoration: none;
}
我已经尝试过设计跨度本身,这似乎没有任何影响.将跨度放置在锚之外,相对于li也不起作用. span阻止锚的悬停事件,并且不可点击.
最佳答案
对您的示例代码进行测试(添加一个包含id的合适div)似乎工作正常：
原文链接：https://www.f2er.com/html/425716.html它的默认样式当然与锚点相同,因此您可能需要将事物重新设置为正常.您必须为我们提供一个工作(或更准确地说不工作)的样本,以便能够精确缩小您的问题所在.
1)您的选择器肯定指向正确的元素(例如,在上面我必须包含一个ID为“leftNav”的div,以使选择器选择它
2)你明确地没有相互冲突的风格 – 可能是具有更高优先级的东西,或者可能具有重要覆盖它的东西.
3)使用Firebug确切地查看哪些样式正在应用哪些CSS选择器来识别问题所在.
编辑：
在下划线的情况下,似乎不可能(或者至少我没有找到)覆盖样式.所以我改变了标记：
使用此标记,您可以按如下方式设置样式：
#leftNav ul li a span.subTitle
{
text-decoration: none;
}
#leftNav ul li a span
{
text-decoration: underline;
}
#leftNav ul li a
{
text-decoration: none;
}
这基本上告诉锚没有下划线.所有跨度都有下划线,然后你的副标题不会有下划线.显然,你需要确保每个想要下划线的符号都在一个范围内(任何不在一个范围内的东西都不会加下划线).
因为IE似乎表现得很好,所以它的价值看起来像浏览器的错误 – http://jsfiddle.net/44ndf/5/在IE上的字幕上没有下划线但是在Firefox上.我怀疑有一些特别的abotu来自锚点的下划线没有被覆盖.
