如何使用 CSS 去除链接或链接图像周围的虚线

最新推荐文章于 2024-09-15 21:53:51 发布

qq_25153359

最新推荐文章于 2024-09-15 21:53:51 发布

阅读量320

点赞数 8

文章标签： css 前端

本文链接：https://blog.csdn.net/qq_25153359/article/details/139335740

版权

答案：使用 CSS `outline` 属性

当超链接变为活动或获得焦点时，链接周围会出现一条虚线以将其与其他链接区分开来，这是超链接的默认行为。基本上是虚线 outline 不会像 border 那样影响周围的元素。

如果您想删除此轮廓，您可以将这些样式应用于您的链接：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>使用 CSS 移除虚线轮廓</title>
<style>
    a, a:active, a:focus{
        outline: none; /* Works in Firefox, Chrome, IE8 and above */ 
    }
</style>
</head>
<body>
    <div class="menu">
        <a href="#">Home</a> | <a href="#">About Us</a> | <a href="#">Contact</a>
    </div>
</body>
</html>

但是，建议应用一些替代样式来指示链接具有焦点。这将使您的网站更易于访问和用户友好。