If you are looking HTML Codes For Horizontal Lines, then you are at the right article. Horizontal Lines play very important role in any web page or website. Horizontal Lines are also known as the Hr in HTML. We can draw Horizontal Lines by using the Hr tag.

Did you know: How To Disable Autocomplete HTML

In the below code, we have used Hr to show the separation of two parts. People mostly used Horizontal Lines to show separately blocks on the screen.

Part 1
This is part one, which is above to the horizontal line./p>

Part 2
This is part two, which is below to the horizontal line.

Horizontal Lines (HR) is also known as the thematic break, mean’s shifting of topic or content. Hr is supported by all the popular browsers, we don’t have to code separately for cross browsers. Hr tag is also used in XHTML. In HTML there is no end tag for Hr but in XHTML there is end tag.

Did you know: How To Change Element Class With JavaScript

HTML Hr Tag

XHTML Hr Tag

...

There are several properties which we can be applied to Horizontal Lines. These are the attributes which we can use with Hr.

• align
• noshade
• size
• width
• color

Did you know: How To Remove Bullets in CSS

HTML Horizontal Lines align Attribute

There are three values which we can use for the align attribute for Horizontal Lines. In the below code, I have used all the three values for align attribute.

HTML Horizontal Lines noshade Attribute

By default, the Hr tag is shaded. To remove the shading property we used the noshade attribute. It’s not supported in HTML 5, so if you want to use the shaded hr then you have to do this with CSS. You can observe both examples in the following code.

Did you know: How To Disable TextArea Resize Property

HTML Horizontal Lines size Attribute

If you are wanted to thick the Hr lines then you have to use the size attribute. You can set the thickness according to the pixels. In the following code thickness or the size is 12.

Did you know: How to Disable Text Selection using CSS

HTML Horizontal Lines width Attribute

If you are wanted to set the width, then you have to use the width property. You can use the width in fixed pixels and percentage. In the following code, we used the both schemes.

Did you know: How to Remove Space Between Inline-block Elements

HTML Horizontal Lines Color Attribute

If you wanted to change the default color of hr, then you have to use the color attribute. In the following code, different colors are used for hr tag to make the appearance more attractive.

Did you know, you can create attractively horizontal lines, which will get the attention of a user. In the below section I have shared some creative HR line design and concepts.

Did you know: HTML Redirect Code With Implementation

HR Dotted Style

This is Heading

Output:

Did you know: How to Horizontally Center Div in another Div

HR Dashed Style

This is Heading

Output:

Did you know: How To Change input placeholder color with CSS

HR Double Style

This is Heading

Output:

Did you know: How To Set cellpadding and cellspacing in CSS

HR Groove Style

This is Heading

Output:

Did you know: How To Proportionally CSS Scale Images

I hope you will found this informative. Don’t forget to share it with your friends. If you have created something special and unique share with us

The post HTML Codes For Horizontal Lines appeared first on Wikia.pk.