Pr.Pg Next Pg

<HR> Horizontal Ruler tag tutorials

  • This is a singular tag element. It doesn’t require closing tag.

  • This stands for Horizontal Ruler. It is used to visually divide document section in separate parts.

  • The following table shows the attributes of <HR> elements.

 

Sr No

Attributes

Descriptions

1

WIDTH

Screen Percentage% or No. of Pixel: This attribute of <HR> element specifies width of the Horizontal Ruler. If it is not given then browser will display ruler of full length, You can specify ruler by giving Screen Percentage% or by giving Number of pixels.

2

ALIGN

LEFT / RIGHT / CENTER: This attribute of <HR> element specifies alignment of Ruler. It works only when Horizontal Ruler is smaller than screen page size. One can set the alignment to Left, Right or Center

3

SIZE

Number of Pixel: This attribute of <HR> element specifies thickness of Ruler. WIDTH attribute specify length of ruler, while SIZE attribute specify Height of the ruler.

4

NOSHADE

This attribute of <HEAD> element specifies that the browser should not shade the line. If used without color it draws solid Ruler.

5

TITLE

Tool tip message: This attribute of <HEAD> element specifies the alternate tag. So, when one place mouse over the ruler, browser display tool tip over the Horizontal ruler.

6

Color

Hexadecimal code or Color name: This attribute of <HR> element will help us to specify color of Horizontal Ruler. One can give text color by specifying Color name or by giving Hexadecimal value.

 

 

Syntax:

<body>

<hr attributes=value>

</body>

 

Example: HTML program to demonstrate horizontal ruler
Output:
Example: HTML program to demonstrate horizontal ruler with it different attributes
Output:

Note: In above program when you move mouse over a last red ruler then it will show you a tool tip with title Horizontal ruler tool tip.

 

Pr.Pg border                                              Next Pg