• Post category:HTML

How to Create a Dotted Line in HTML.

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:

dotted line in html

Steps:

  1. In the above HTML code, first, we have written the Basic Structure of HTML, and the title is set to “Dotted Line”.
  2. Then we have creatd <hr> tag with classname dot.
  3. 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”.
  4. See the above output, the dotted line is displayed successfully.
READ ALSO  How to Use Anchor Tag in HTML to Grow Your Website Traffic

Leave a Reply