Firefox在图像链接周围显示蓝框

Question

我的网站上的所有这些图片都有一个锚标记。单击它时，它会滚动到id“模板”。

<a class="hi" href="#template"><img src="images/01.png" /></a>

我已经尝试了书中的每一个技巧。

a img{border:none; outline: none;}

border=0在图片代码中。

无论我做什么，一旦你点击它，图像周围总会有一个蓝色边框。单击任意圆形图像（向下）以供参考。请记住，要在Firefox中查看。

http://stevendennett.com/newsite/

谢谢！

Answer 1

图像周围的虚线边框是<a>标签的轮廓。因此，当您删除img中的边框和轮廓时，它将不是解决方案。

解决方案

我们不需要付出太多代码。试试这里：

a { /* Remove all the outline border all in our document. */
   outline: none;
}

Answer 2

我可以通过将锚色设置为透明来删除边框：

a.hi {
  color: transparent;
}

Answer 3

试试这个：

a.hi {
    outline: none;
    color: transparent;
    text-decoration: none;
}

Answer 4

试试这个：

a.hi {
    outline: medium none;
}

Answer 5

图像在Chrome和Opera（15+）中运行良好。

所以正在发生的问题是浏览器的默认效果，这是FF中发生的情况。

IE（10）：

但它在Chrome中很好，这意味着CSS中没有这样的效果。

所以你必须尝试添加这个：

a > img {
   border: 0;
}

它将从a超链接下的所有图像中删除边框。

查看您的代码：

在您的css文件中，在第35行（如果我没错），您正在outline: medium none和border: medium none;

我删除了，没有边框！试试吧:)）