如何去除 link 图片下的 link 小栏？

Question

在我的图片下面有一个看不见的小条link，是一个link。有什么方法可以让这个栏消失或成为 un-selectable/un-clickable?

谢谢！

Answer 1

您可以像这样向标签添加 css 属性：

<a href="" style="display: none;"></a>

这将阻止显示或点击 link。如果您希望将 css 和 html 分开，您可以执行以下操作：

<style>
    .noDisplay {
        display: none;
    }
</style>
<a href="" class="noDisplay"></a>

要了解有关 html 和 css 的更多信息，您可以查看 freecodecamp.org。

Answer 2

你能检查一下下面的代码吗？希望它对你有用。出现此问题是因为 <a> 标记是内联元素。您不需要为 <a> 标签添加样式。

您可以比较以下示例（有无display 属性）。

.link-block {
  display: inline-flex;
}

<a href="#" class="link-block">
  <img src="https://via.placeholder.com/240x200" alt="placeholder">
</a>
<hr />
<a href="#" class="">
  <img src="https://via.placeholder.com/240x200" alt="placeholder">
</a>

注意：您可以根据 .link-block class.

中的要求使用 inline-block、block、inline-flex 或 flex

如何去除 link 图片下的 link 小栏？

How to get rid of this little bar of link under a link image?

html

css

hyperlink