HTML Horizontal Line (hr)


The hr tag in HTML draws a horizontal line (row) across the page, that’s it. The hr element is most often displayed as a horizontal rule. It’s used to separate parts of a web page. Below is an example of a horizontal line. It’s hard to see as it is gray and thin.


<hr>

I will do some more examples here. The code and example is below. Follow the format of style equals then double quotes. Each style is separated with a semicolon. Notice that the color of the line is red and that we don’t use color, but use background-color instead.


<hr style="width:100%;background-color:red;height:2px">

Below is another example. It’s set to 80% of the page width, three pixels in height and blue.


<hr style="width:80%;background-color:blue;height:4px">


<hr style="width:95%;background-color:gray;height:2px">

Learn from other websites

A really good resource for learning the hr tag HTML is over at w3schools.com.

Leave a Reply