[分享]css去除超链接图片边框

网站开发中，我们经常会使用图片来做超链接，但使用默认的样式时，图片周围会有一个蓝色的边框，这对页面的美观影响很大，因此我们需要去除这个边框。下面介绍一些常用的去除超链接图片边框的方法。方法一：使用CS...

网站开发中，我们经常会使用图片来做超链接，但使用默认的样式时，图片周围会有一个蓝色的边框，这对页面的美观影响很大，因此我们需要去除这个边框。下面介绍一些常用的去除超链接图片边框的方法。

方法一：使用CSS的border属性将边框设为0

a img{
  border:0;
} 

使用这个方法，可以将链接图片的边框直接设为0，达到去除边框的效果。

方法二：使用CSS的outline属性将边框设为0

a img{
  outline:none;
} 

使用这个方法，可以将链接图片的outline（轮廓线）设为none，达到去除边框的效果。但需要注意的是，这个属性不兼容IE6及以下浏览器。

方法三：给链接套上一个div，使用CSS的overflow属性将边框隐藏

<div style="overflow:hidden">
  <a href="#">
    <img src="xxx.jpg" alt="xxx">
  </a>
</div> 

使用这个方法，可以将链接图片嵌套在一个div中，并通过设置overflow:hidden将边框隐藏起来，达到去除边框的效果。

总结：以上三种方法中，第一种是最简单的，同时也是最兼容的；第二种是最直接的，但不兼容IE6及以下浏览器；第三种相对来说比较麻烦，但可以适用于一些需要对链接图片做更多处理的场景。