css - 不确定如何从 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>