When a hyperlink becomes active or receives focus, a dotted line appears around the link to distinguish it from other links. This is the default behavior of hyperlinks. It's basically a dashed outline that doesn't affect surrounding elements like a border. If we want to remove the css dotted line style, we can use the CSS property "outline:none;" to achieve this.
Let’s take a simple example to introduce how to remove the css dotted line style.
The code example is as follows:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>使用CSS删除虚线轮廓</title>
<style type="text/css">
a, a:active, a:focus{
outline: none; /* *适用于Firefox，Chrome，IE8及以上版本* */
}
</style>
</head>
<body>
<div class="menu">
<a href="#">Home</a> | <a href="#">About Us</a> | <a href="#">Contact</a>
</div>
</body>
</html>outline (outline) is a line drawn around the element, located outside the edge of the border, which can highlight the element. The outline attribute sets the outline around the element.
Note: Always declare the outline-style attribute before the outline-color attribute. The color of an element's outline can only be changed after it has obtained its outline.
Note: Contour lines do not occupy space and are not necessarily rectangular.
The default value is none.
This article is an introduction on how to remove the css dotted line style. It is very simple and easy to understand. I hope it will be helpful to novices!
The above is the detailed content of How to remove css dotted line style. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
