Dotted Line in HTML
In this article, we will see how to create a dotted line in HTML.
Step-by-step guide to creating a dotted line
Code:
<!DOCTYPE html>
<html>
<head>
<title>Dotted Line</title>
<style type="text/css">
.dot{
border: none;
border-top: 5px dotted black;
}
</style>
</head>
<body>
<hr class="dot">
</body>
</html>Output:
Steps:
- In the above HTML code, first, we have written the Basic Structure of HTML, and the title is set to “Dotted Line”.
- Then we have creatd <hr> tag with classname dot.
- We select the classname “dot” in CSS using a class selector. Inside the parentheses, we set the “border” property to none and the “border-top” property to 5px dotted black”.
- See the above output, the dotted line is displayed successfully.
