Webpage Workshop: Home » XHTML 1.0 language reference » Horizontal rule

Horizontal rule

This element is used to insert a separator between document sections. The horizontal rule element is usually marked up as a line in graphical browsers.

<hr
    align="center | left | right"**
    class="class name(s)"
    id="unique identifier"
    noshade**
    size="pixels"**
    style="style information"
    title="text"
    width="% | pixels"**
/>

Key:
‡ = Required attribute
** = Transitional only

Explanation of attributes

align**: used to specify the horizontal alignment of the content of this element.

class: used to state which class(es) the element belongs to. It is possible to indicate more than one class for an element by separating each class name with a space character. This attribute is normally used in combination with a stylesheet in order to associate the elements with particular styles defined within the stylesheet.

id: used to specify a unique alphanumeric identifier to the element. This is usually used in combination with stylesheets in order to apply a style to one particular instance of an element. Only one element, regardless of type, can be given a particular id.

noshade**: this attribute is used to state that the horizontal rule should be displayed as a solid bar with no shading.

size**: used to specify the height or thickness (in pixels) of the horizontal rule.

style: used to specify an inline style to apply to the element. The styles defined here override the styles declared in the header section.

title: used to define an advisory text that may be displayed as a tooltip when a mouse is used to hover over the element.

width**: used to specify the width of the horizontal rule. This attribute can be a percentage (relative) of the parent container, or a pixels (absolute) value.

Event handlers

The following event handlers are defined for this element:

Basic example

<hr />

The above code will display something like:


Compatibility

Description: Support of horizontal rule and attributes in various browsers
Test Internet Explorer 6+ Netscape 4 Mozilla and Netscape 6+ Opera 6+ MSN TV (WebTV) Konqeuror 3.0+
Basic element support  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: align  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: class  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: id  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: noshade  Yes  Yes  Yes  Yes  Yes 
Attribute: size  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: style  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: title  Yes  No  Yes  Yes  No  Yes 
Attribute: width  Yes  Yes  Yes  Yes  Yes  Yes 

Key:
The browser icons are explained in the below list:
Internet Explorer 6+ = Microsoft Internet Explorer 6+
Netscape 4 = Netscape Communicator 4
Mozilla and Netscape 6+ = Mozilla and Netscape Navigator 6+
Opera 7+ = Opera 7+
MSN TV (WebTV) = MSN TV (aka. WebTV)
Konqeuror 3.0+ = Konqueror 3.0+