Html Studio's


Lesson 9


Another little widget that you will find yourself using a lot is the Horizontal Rule.

<BODY>
<HR>
</BODY>



We have a few options available to us...

<BODY>
<HR WIDTH=20%>
<HR WIDTH=50%>
<HR WIDTH=100%>
<HR WIDTH=20>
<HR WIDTH=50>
<HR WIDTH=100>
</BODY>








This one is pretty self explanatory.

<BODY>
<HR WIDTH=60% ALIGN="left">
<HR WIDTH=60% ALIGN="right">
<HR WIDTH=60% ALIGN="center">
</BODY>





We can control the thickness of the line...

<BODY>
<HR WIDTH=60% SIZE=1>
<HR WIDTH=60% SIZE=3>
<HR WIDTH=60% SIZE=8>
<HR WIDTH=60% SIZE=15>
</BODY>






And we can make it a solid line.

<BODY>
<HR WIDTH=60% SIZE=1 NOSHADE>
<HR WIDTH=60% SIZE=3 NOSHADE>
<HR WIDTH=60% SIZE=8 NOSHADE>
<HR WIDTH=60% SIZE=15 NOSHADE>
</BODY>






Remember when I said that the browser doesn't understand formatting, it just displays text in a steady stream? Kind of like this...

<BODY>
                ///\\___
                (@ @)
     +----oOO----(_)-----------+
     |      BARRY GOLDWATER    |
     |           for           |
     |        President        |
     +-----------------oOO-----+
               |__|__|  
                || ||
               ooO Ooo
</BODY>

///\\___ (@ @) +----oOO----(_)-----------+ | BARRY GOLDWATER | | for | | President | +-----------------oOO-----+ |__|__| || || ooO Ooo

 


Well, with the <PRE> (preformat) tag, we can put a stop to that and have things displayed the way we type them.

<BODY>
<PRE>
                ///\\___
                (@ @)
     +----oOO----(_)-----------+
     |      BARRY GOLDWATER    |
     |           for           |
     |        President        |
     +-----------------oOO-----+
               |__|__|  
                || ||
               ooO Ooo
</PRE>
</BODY>

                ///\\___
                (@ @)
     +----oOO----(_)-----------+
     |      BARRY GOLDWATER    |
     |           for           |
     |        President        |
     +-----------------oOO-----+
               |__|__|  
                || ||
               ooO Ooo

Notice that a monospaced font is used.


The last tag we're going to discuss is a comment.

<BODY>
<!--This is a comment-->
This is not
<P>A comment can be placed anywhere in the document and the browser
will ignore everything inside the brackets. You can insert hidden
messages, <!--Hi Mom!--> notes to yourself, <!--Pick up milk--> or
write a helpful message to someone looking at the source of your
page.<!--Copy anything off me and you're dead meat!-->
</BODY>

This is not

A comment can be placed anywhere in the document and the browser will ignore everything inside the brackets. You can insert hidden messages, notes to yourself, or write a helpful message to someone looking at the source of your page.

Just to be absolutely clear, the comment must start with <!-- and end with -->
You can (usually) even put other html tags in a comment and they will be ignored. The browser will just keep ignoring everything until it sees a -->


<--BACK        NEXT-->


General Table
of Contents
Lessons
Intro - 1 - 2 - 3 - 4 - 5