HTML provides the <hr> tag in order to create lines horizontally. The <hr> name comes from the horizontal tag. In general, the line tag is used to divide the web page into separate sections. The <hr> tag is a single tag where there is no need to end the tag. In this tutorial, we examine different attributes of the <hr> line tag for HTML.
Line Tag
The <hr> tag is used to create line in HTML web pages.
<html>
<body>
<h1>This is header</h1>
<p>Some content</p>
<hr>
<p>Some content</p>
<hr>
<p>Some content</p>
</body>
</html>
Align Line Tag
The line tag can be aligned by using the align attribute. The left , center and right can be used for the alignment of the line tag. The alignment can be useful if the hr line tag width is specified.
<html>
<body>
<h1>This is header</h1>
<p>Some content</p>
<hr align="left">
<p>Some content</p>
<hr align="right">
<p>Some content</p>
</body>
</html>Line Tag Without Shade
We can remove the share of the <hr> line tag by adding the noshade attribute to the tag. In the following example, the first line has shade but the second line does not have shade.
<html>
<body>
<h1>This is header</h1>
<p>Some content</p>
<hr>
<p>Some content</p>
<hr noshade>
<p>Some content</p>
</body>
</html>
Set Size of Line Tag
We can set the size of the line tag by using the size attribute. We just need to provide the size in pixels etc. In the following example, we set the size of the line tags as 10px and 20px.
<html>
<body>
<h1>This is header</h1>
<p>Some content</p>
<hr size="20px">
<p>Some content</p>
<hr size="10px">
<p>Some content</p>
</body>
</html>
Set Width of Line Tag
Another useful attribute of the <hr> line tag is the ability to change its width. The width attribute can be used to set it. In the following example we set the <hr> line tags width as 50px and 200px.
<html>
<body>
<h1>This is header</h1>
<p>Some content</p>
<hr width="50px">
<p>Some content</p>
<hr width="200px">
<p>Some content</p>
</body>
</html>