Adding Horizontal Rules

One graphic element that is completely supported by the majority of the browsers is the horizontal rule. There are several attributes you can use to jazz up horizontal rules, although they've all been deprecated in favor of styles.

To insert a horizontal rule:


Type <hr where you want the rule to appear. The text that follows will appear in a new paragraph below the new rule.

Figure 5.36. The hr tag includes an automatic line break both before and after the rule.

Figure 5.37. Horizontal rules can be helpful for dividing sections on your page.


If desired, type size="n", where n is the rule's height in pixels.


If desired, type width="w", where w is the width of the rule in pixels, or as a percentage of the document's width.


If desired, type align="direction", where direction refers to the way a rule should be aligned on the page; either left, right, or center. The align attribute is only effective if you have made the rule narrower than the browser window.


If desired, type noshade to create a solid bar, with no shading. Add ="noshade" in XHTML.


Type the final /> to complete the horizontal rule definition.

Figure 5.38. The hr attributes are deprecated but well supported.

Figure 5.39. You can make horizontal rules thicker and narrower.


  • All of the attributes for HR (but not HR itself) are deprecated. The W3C recommends using styles to format your horizontal rules (see page 169).

  • There is no CSS equivalent to noshade. One solution is to omit rules and just apply borders (see page 184).

HTML, XHTML, & CSS(c) Visual QuickStart Guide
HTML, XHTML, and CSS, Sixth Edition
ISBN: 0321430840
EAN: 2147483647
Year: 2004
Pages: 340

Similar book on Amazon © 2008-2017.
If you may any questions please contact us: