如何删除使用CSS下方下划线

Question

下面是我的代码，其中我使用了text-decoration：none;但现在起作用了，它下面还有一条蓝线。 http://jsfiddle.net/NW8Nw/1/

// CSS

.thumbnail:hover{z-index: 50;text-decoration: none;position:relative;} 
.thumbnail span{ position: absolute;background:#000;padding: 5px;left: -1000px; 
border: 0px solid #ddd;visibility: hidden;color: #fff;width:388px;height:190px;text- decoration: none;} 
.thumbnail:hover span{ text-align:left;visibility: visible;top: 0;left: 110px;text- decoration:none; 
top:-120px;-webkit-box-shadow: 0 8px 6px -6px #aaa; -moz-box-shadow: 0 8px 6px -6px #aaa;box-shadow: 0 8px 6px -6px #aaa;} 
.hoverbold{ text-decoration:none; 
font-family:verdana;font-size:11px;color:#B09F6E;text-shadow:0px 0px 1px #B09F6E;}​ 

// HTML

<div class="thumbnail" style="position:relative;"> 
     <a href="<?php echo SITE; ?>"> 
<img src="" style="border:6px solid #ddd;" height="110" width="140"> 
<div style="position:absolute;border:0;left:120px;top:90px;"> 
<img src="http://url.com/play.png" border="0"/> 
<span> 
<div style="padding-left:20px;"> 
<b style=" text-decoration:none;">Simply beautiful.</b> 
</div> 
<div style="padding:20px 0px 0px 20px;"> 
<b CLASS="hoverbold">EDITOR REVIEW :</b> 
</div> 
</span>​ 

Answer 1

链接是在CSS文本独立的，所以你要专门设置链接文本修饰：无。

例如：

A:link {text-decoration: none} 
A:visited {text-decoration: none} 
A:active {text-decoration: none} 

Answer 2

你没有关闭的标签。另外，您需要应用text-decoration：none;到一个标签，因为这是什么导致下划线。

Answer 3

那是你的text-shadow这是创造问题

.hoverbold { 
    text-decoration: none; 
    font-family: verdana; 
    font-size: 11px; 
    color: #B09F6E; 
    text-shadow: 0px 0px 1px #B09F6E; /* Remove This */ 
}