[英]How to Remove Underline below text using CSS
下面是我的代碼,其中我使用了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>
多數民眾贊成你的text-shadow
造成了問題
.hoverbold {
text-decoration: none;
font-family: verdana;
font-size: 11px;
color: #B09F6E;
text-shadow: 0px 0px 1px #B09F6E; /* Remove This */
}
鏈接與CSS中的文本是分開的,因此您必須專門設置文本修飾的鏈接:無。
例如:
A:link {text-decoration: none}
A:visited {text-decoration: none}
A:active {text-decoration: none}
你沒有關閉你的標簽。 此外,您需要應用text-decoration:none; 到標簽,因為這是導致下划線的原因。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.