如何去除超链接图像周围的黑色边框？

Posted 2023-03-05

【中文标题】如何去除超链接图像周围的黑色边框？

【英文标题】：How to remove black border around hyperlinked image?

【发布时间】：2010-09-08 04:13:54

【问题描述】：

当我将图像 (<img>) 转换为超链接（通过将其包裹在 <a> 中）时，Firefox 会在图像周围添加黑色边框。 Safari 不显示相同的边框。

什么 CSS 声明最适合消除边框？

【参考方案1】：

试试这个：

img 
  border-style: none;

【参考方案2】：

a img 
    border-width: 0;

【讨论】：

这是无效的 CSS：'0' 没有单位。应该只是“border-width: 0;”。

@BobbyJack 当然 0 需要一个单位。即使可以从上下文中推导出来，所有数字（0 是数字）都需要一个单位才有意义。如果您将其关闭，浏览器会自动添加“px”，以消除您的懒惰 - 但它仍然需要存在。

【参考方案3】：

只需添加：

border: 0;

或：

a img 
  border: 0;

从所有图像链接中删除边框。

这应该可以解决问题。

【参考方案4】：

img 
    border: 0

或老式：

<img border="0" src="..." />
     ^^^^^^^^^^

【讨论】：

这个解决方案帮了我很多，希望我能在 2 小时的挫折之前找到它！但我认为使用“a imgborder: 0;”是解决原始问题的更合适的解决方案 - 强调最初​​的“a”，因为该问题仅在图像包含在超链接中时才会出现

【参考方案5】：

在代码中使用border=0。比如：

<img href="mypic.gif" border="0" />

在css内

border : 0;

您的图像属于哪个类别。

【讨论】：

注意：您的 标签不正确。您必须使用 " 引用边框属性值（因为 XML 要求这样做），或者您必须在结尾 > 之前删除 / （因为 SGML/html 不允许这样做）