Horizontal rule created with HR Tag is used to insert a horizontal line or rule in web page. The most common use of HR is to define separation of web page content. This is a singular tag that inserts a blank space before and after the line thus rendered.
Features of HR Tag
- HR Tag is not a paired tag and it does not allow any content.
- This Tag creates an end to end horizontal line.
- You can create any number of horizontal lines in a web page .
- Horizontal Rule can be rendered with style and color.
Attributes of HR Tag
ID
This attribute is used to give identification to a horizontal line created with HR Tag. The ID must be an alphanumeric string. The ID value for each element of web page must be unique. This ID is used in a script to manipulate it on the basis of interaction of the user.
ALIGN
Align attributes is used to align the horizontal line. It can be aligned to left, center or right. The values allowed for the ALIGN attribute are LEFT, RIGHT and CENTER. The rule will appear LEFT aligned by default.
COLOR
This attribute is set with a color value to create a colored horizontal line in a web page. The default color for a line is gray.
NOSHADE
This attribute inhibits the surrounding shadow around the horizontal line in a web page. By default the line is drawn with a shadow.
WIDTH
By default the horizontal line is drawn as 100% of the page width. The width attribute can be set to numeric value up to 100. It can also be set to some percentage of page width.
SIZE
By default the horizontal line is drawn with 2px height or size. This attribute can be set to numeric value in pixels or percentage of page height.
CLASS
This attribute is used to associate a horizontal line with a class that specifies the consistent style for multiple elements in a web page.
STYLE
Style attribute is used to add additional styling to a line. You can set styles in a string form with CSS element and value pairs separated by semicolons.
TITLE of HR Tag
Title attribute is used to set tooltip text for a HR tag. When the user rests the mouse cursor on the horizontal line, a value assigned to TITLE attribute appears in a small outlined box.
Example of HR Tag
<TITLE> Welcome to CSVeda.com </TITLE> <HTML> <BODY> <HR> <HR NOSHADE> <HR color="green" > <HR width="50%" > <HR SIZE="10px" color="Yellow" > <HR TITLE="myline" STYLE="border:dotted; color:red;" > </BODY> </HTML>
