2013-04-20 61 views
4

在這種情況下,懸停在左鏈接上會在其右側(兩個鏈接之間)顯示一個小短劃線。我怎樣才能擺脫這一點?我在Safari和Chrome中都看到了這一點,但是我沒有看到樣式表中的任何內容能夠實現這一點。懸停在一個鏈接上使得小短劃線顯示在其右側

<!DOCTYPE html> 
<html> 
<head> 
     <meta charset="utf-8"> 
     <title>Walls</title> 
     <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen"> 
     <link rel="stylesheet" href="custo.css"> 

     <script src="prettyPhoto_compressed_3/js/jquery-1.3.2.min.js" type="text/javascript" charset="utf-8"></script> 
<link rel="stylesheet" href="prettyPhoto_compressed_3/css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" /> 
<script src="prettyPhoto_compressed_3/js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script> 
</head> 

</head> 
<body> 

<br> 
       <a href="gallery.html"> 
       <img src="test.jpg" class="testclass" alt="test" width="170" /> 
       </a> 

       <a href="info.html"> 
       <img src="test.jpg" class="testclass" alt="test" width="55" /> 
       </a> 



<div class="container-fluid"> 
<br> 


</div><!-- .container --> 

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script src="js/bootstrap.min.js"></script> 

    <script type="text/javascript" charset="utf-8"> <!--initialize prettyPhoto--> 
    $(document).ready(function(){ 
    $("a[rel^='prettyPhoto']").prettyPhoto(); 
     }); 
    </script> 


</body> 
</html> 

回答

7

如果你看到同樣的事情,我看到(我不知道所有的樣式表),您所看到的a標籤的圖像的下劃線。

你可以在你的圖片鏈接上使用text-decoration: none;

<a href="gallery.html" style="text-decoration: none !important;"> 

!important在風格的結束有助於覆蓋在你的CSS可能已經有一個!important強調任何選擇。

當然這實際上更好地使用class that you set on your image links完成。

+0

我做到了這一點,也設置了我自己的類,它一直這樣做。還有什麼沒有道理的是爲什麼第二個鏈接不會在任何地方創建破折號?我可以發佈圖片,但我是1代表短能夠發佈圖像在這裏。 – Retcon 2013-04-20 06:10:44

2

這是一篇舊帖子,但我想對某件事做出貢獻。這將幫助其他人爲什麼出現短跑( - )。

這是因爲標籤內部有空的空間。例如:

<a href="#"> 
    <i>test</i> 
</a> 

如果設置的行這樣的:<a href="#"><i>test</i></a>破折號/下劃線會消失,但一些工具仍可能格式化您的代碼,他們將增加的空間。因此,使用前一篇文章中提到的css將會消除這個問題。

相關問題