去掉点击链接时周围的虚线框outline属性

要去掉点击链接时周围的虚线框，需要设置链接的样式，具体步骤如下：

1. 在CSS样式中，设置所有链接的选中状态为none，这会让所有链接点击时去掉默认的虚线边框

a:active, a:focus {
  outline: none;
}

1. 接下来，我们需要给链接设置其他的样式，以增强链接的可读性和易用性。比如我们可以设置链接的颜色、字体、背景色等属性，以下是一个示例：

a {
  color: #1e90ff; /* 设置链接字体颜色 */
  text-decoration: none; /* 去掉下划线 */
  background-color: #eee; /* 设置链接背景色 */
  padding: 5px 10px; /* 设置链接内边距 */
  border-radius: 3px; /* 设置圆角 */
}

a:hover {
  background-color: #1e90ff; /* 鼠标悬停时设置背景色 */
  color: #fff; /* 鼠标悬停时设置字体颜色 */
}

通过以上CSS代码，我们设置了链接的样式，并且去掉了虚线边框，这样用户点击链接时就不会看到虚线框了。

示例说明：

1. 简单的文本链接

<a href="#">点击我</a>

如果没有设置样式，那么点击这个链接时，周围会有一条虚线边框。但是，如果设置了样式，比如以下代码，虚线框就会被去掉：

a:active, a:focus {
  outline: none;
}

1. 图片链接

<a href="#">
  <img src="image.png" alt="图片链接">
</a>

如果没有设置样式，那么点击这个链接时，图片周围会有一条虚线边框。但是，如果设置了样式，比如以下代码，虚线框就会被去掉：

a img:active, a img:focus {
  outline: none;
}