html - 在所有 href 标签文本下划线 : issues with having </span><br/><span> inside href tag

Question

我有一个小问题，不知道如何解决。在我的 HTML 中，我有一个 ahref 标签，里面有一个“/span”标签、一个换行符和一个新的“span”标签。

在我的 CSS 中，我有一个类可以在鼠标悬停时使我的 ahref 标记下划线。

其中带有“/span”“br”“span”的一个 ahref 标签不会同时加下划线……它们只会在鼠标悬停在每一行上时单独加下划线。 (下面演示)

span 类用于调整行高，这些调整是将内容与相邻上下文正确对齐所需的。

简化的 HTML:

<span class="span1">
    <a href="www.google.com" target="_blank">The Google</a><br/><br/>
    <a href="www.stackoverflow.com" target="_blank">The StackOverFlow</a><br/><br/>
    <a href="www.us.gov" target=_"blank">Important </span><br /><span class="span2"> Information</a></span>

简化的 CSS:

a, a:link, a:active, a:visited{
    text-decoration: none;
}

a:hover{
    text-decoration: underline;    

}

span.span1{
    font-style:normal;  
    font-size:70%;
    line-height: 250%;
}

span.span2{
    font-style:normal;  
    font-size:70%;
    line-height: 100%;

}

有什么想法吗？请看演示:http://jsfiddle.net/9rFzC/

Answer 1

将您的 html 更新为:

<span class="span1">
    <a href="www.google.com" target="_blank">The Google</a><br/><br/>
    <a href="www.stackoverflow.com" target="_blank">The StackOverFlow</a><br/><br/>
    <a href="www.us.gov" target=_"blank"><span>Important </span>

<br /><span class="span2"> Information</span>

</a>
</span>

它应该可以无缝运行。基本上，修复缺失的 <span>和 </span>标签。

检查这个 fiddle :http://jsfiddle.net/9rFzC/2/