HOW TO BUILD A PROFESSIONAL WEB SITE Rel. 1.1

LESSON 04 - Chapter h

by Carlo Scodanibbio

home

enrol

Lessons

welcome
1 - chapter a
1 - chapter b
1 - chapter c
1 - chapter d
1 - chapter e
1 - chapter f
1 - chapter g
1 - chapter h
1 - chapter i
1 - chapter j
1 - chapter k
2 - chapter a
2 - chapter b
2 - chapter c
2 - chapter d
2 - chapter e
2 - chapter f
2 - chapter g
2 - chapter h
3 - chapter a
3 - chapter b
3 - chapter c
3 - chapter d
3 - chapter e
3 - chapter f
3 - chapter g
3 - chapter h
4 - chapter a
4 - chapter b
4 - chapter c
4 - chapter d
4 - chapter e
4 - chapter f
4 - chapter g
4 - chapter h
4 - chapter i
4 - chapter j
4 - chapter k
5 - chapter a
5 - chapter b
5 - chapter c
5 - chapter d
5 - chapter e
5 - chapter f
5 - chapter g
6 - chapter a

And now

other formatting tools : the horizontal rule

This is a handy gadget, very useful to create a separation between two parts of a Document.

The STANDALONE TAG is: <HR>

Example:

<BODY BGCOLOR="#CCFF00">
Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla Blabla bla bla <HR>
Buh bu buhh bubuh buh bubuh bubuh Bubububh Buh bu buhh bubuh buh bubuh bubuh Bubububh Buh bu buhh bubuh buh bubuh bubuh Bubububh Buh bu buhh bubuh buh bubuh bubuh Bubububh etc. etc. etc.
</BODY>

The Browser will display this:

TIP
Horizontal Rules are made with pure HTML Code, which is nothing else than ASCII text, extremely low in Kb consumption.
Use Horizontal Rules instead of graphic Lines if you can: your Web Pages will download faster !

As you can see, the HR Tag has obtained the effect of separating the "preceding" and the "following" string of text with a sort of horizontal, "shaded" line.
Pretty straight forward.

You may increase the vertical spacing between the upper and/or the lower text and the Horizontal Rule by introducing LINE BREAKS and PARAGRAPHS Tags in combination before and/or after the HR Tag. Test it by yourself.

With suitable ATTRIBUTES in the HR Tag we can control:

The Width of the HR through the Attribute WIDTH. This Attribute can have two types of settings. You may set it either in pixels ("absolute" setting) or in % of the available Browser window width ("relative" setting). In this last case the default value is100%. This issue requires a very important clarification which I am going to give you after the first examples.
The Alignment of the HR through the Attribute ALIGN, which can be set at LEFT or CENTRE (default) or RIGHT.
The Thickness of the HR through the Attribute SIZE, which, by default, is 2 (pixels). Also this issue requires some clarification, which I am going to give you after the examples below.
And we can make the HR a solid line (instead of a "shaded" line) with the Attribute NOSHADE, which stands alone and requires no setting. By default (i.e. if you do not insert the NOSHADE Attribute) a HR is "shaded".

Some examples will clarify the issue. Look at this code:

This is what your Browser will display:

shut-down this HTML story !

http://webbuildcourse.tripod.com

full details of this Course at
http://www.scodanibbio.com/webbuild