删除图像链接的下划线

duh*_*ime 6 html css html5 image jekyll

我的页面上有一个大图像,其中也有一个link元素,我想从图像链接中删除下划线。我正在使用Chrome,它会在图片链接下显示突出显示的内容,并声称css是由引入的user agent stylesheet,我知道这是Chrome的默认css。将user agent stylesheet带来以下样式到我的网页:

a:-webkit-any-link {
    color: -webkit-link;
    text-decoration: underline;
    cursor: auto;
}
Run Code Online (Sandbox Code Playgroud)

如何从该图像链接中删除下划线?我尝试将链接和图像的ID设置为img-link随后使用以下CSS定位该ID,但没有任何运气:

<a id="img-link" href="/images/post_images/mapping_early_english_books/provincial_printing.png" data-lightbox="provincial_printing" data-title="My caption">
  <img id="img-link" src="/images/post_images/mapping_early_english_books/provincial_printing.png" alt="Provincial Printing" style="width:100%" /></a></p>

#img-link {
    text-decoration: none;
}
Run Code Online (Sandbox Code Playgroud)

他人在消除此下划线方面可以提供的任何帮助将不胜感激!

Sau*_*hra 6

#img-link, #img-link img{
   text-decoration: none !important;
   border:0px !important;
   outline:none;
   border-width: 0px;
   outline-width:0px;
   border-bottom: none;
}
Run Code Online (Sandbox Code Playgroud)