不知道如何从css中的图像中删除下划线

Question

我正在制作的网站在超链接中的一些文字旁边有一张图片。

图像带下划线，文字也是如此。我希望图片不要加下划线。

a { 
 
    -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
 
    -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
 
    -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
 
    transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
 
    border-bottom: dotted 1px; 
 
    color: #0066cc; 
 
    text-decoration: none; 
 
} 
 
a:hover { 
 
    border-bottom-color: transparent !important; 
 
    color: #0066cc !important; 
 
    text-decoration: none; 
 
} 
 
img { 
 
    outline: none !important; 
 
    text-decoration: none !important; 
 
    border-bottom-color: transparent !important; 
 
    border-bottom: none; 
 
    outline-width: 0px; 
 
}

<a href="domain.com"><img src="pic.gif">check this out></a>

它没有工作。

如果将鼠标悬停在图像上，下划线将消失，但我希望它不会存在。

Answer 1

如果你想只在图像删除线，请使用如下代码： -

CSS： -

a 
{ 
    -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
    -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
    -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 

    color: #0066cc; 
    text-decoration: none; 
} 
a span{ 
border-bottom: dotted 1px; 
} 
a span:hover { 
    border-bottom-color: transparent !important; 
    color: #0066cc !important; 
    text-decoration: none; 
} 

HTML： -

<a href="domain.com"><img src="pic.gif"><span>check this out></span></a> 

如果你想从整个图像和文字中删除线条，请使用以下代码： -

CSS： -

a 
    { 
     -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
     -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
     -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 

     color: #0066cc; 
     text-decoration: none; 
    } 
a span{ 
border-bottom: dotted 0px; 
} 
a span:hover { 
    border-bottom-color: transparent !important; 
    color: #0066cc !important; 
    text-decoration: none; 
} 

HTML： -

<a href="domain.com"><img src="pic.gif"><span>check this out></span></a> 

Answer 2

把文成<span></span>，从链接中删除下划线，并设置强调只为跨度。它应该工作。