HTML Lessons  

  1. HTML Introduction

  2. HTML Tags

  3. HTML Page Structure

  4. HTML Backgrounds

  5. HTML Formatting Text

  6. HTML Formatting Fonts

  7. HTML Headings

  8. HTML Entities

  9. HTML Line Breaks

  10. HTML Lists

  11. HTML HR- Horizontal Rule

  12. HTML Images

  13. HTML Links

  14. Table Introduction

  15. Table Rows & Columns

  16. Table Width

  17. Table Alignment

  18. Table Border Color

  19. Table Background Color

  20. Table Background Image

  21. Cell Alignment

  22. Cell Padding

  23. Cell Spacing

  24. Cell Spanning

 

Horizontal Rule

The horizontal rule is very useful in helping divide sections of your page. 

Below is an example of a horizontal rule.

 


 

To create a horizontal rule you'll need to use the <hr> tag. This tag does not need a closing tag.

<body> <hr> </body>

You can adjust the width of the horizontal rule as follows.

<body> <hr width="50%"> </body>


or maybe you want it a little bigger

<body> <hr width="75%"> </body>


Keep in mind that by using a percent value the line will take up a percentage of the browser window. Therefore it may look very different in two different browsers.

To make things more exact you can measure the width of the line by using pixels. To do this, simply leave out the percent sign, like so:

<body> <hr width="50"> </body>


You can also set the alignment.  The default is centered.

<body> <hr align="right" width="50%"> </body>


or

<body> <hr align="left" width="50%"> </body>


or

<body> <hr align="center" width="50%"> </body>


You can also set the thickness of the line.

<body> <hr size="1" width="50%"> </body>


or maybe you want it a little bigger

<body> <hr size="10" width="50%"> </body>


even bigger?

<body> <hr size="20" width="50%"> </body>


You can also make the line solid by inserting NOSHADE.

<body> <hr size="20" width="50%" NOSHADE> </body>


Next Lesson

© Copyright Studio6000 2006. All rights Reserved.