HTML elements that effect the look of the page

Line break <br> or <br />

There is no </br> tag. It has an empty/void element. 


     A line without break. 
     Here is a line. <br>
     Another line. <br>
     Then a line with two breaks after it. <br><br>
     Here you go.

Interpreted by the browser:
A line without break. Here is a line.
Another line.
Then a line with two breaks after it.

Here you go.
Notes

<hr>

Horizontal rules <hr> or <hr />. Also has no closing tag.

     A line here.
     <hr>
     A line there.

Interpreted by the browser:
A line here.
A line there.
Notes

<pre> ... </pre>

Preformatted text tag. Any formatting done using white space is retained. Browsers differ in the number of characters used for tabs.

<pre>
            
               ,;::\::\
             ,'/' `/'`/
         _\,: '.,-'.-':.
        -./"'  :    :  :\/,
         ::.  ,:____;__; :-
         :"  ( .`-*'o*',);
          \.. ` `---'`' /
           `:._..-   _.'
           ,;  .     `.
          /"'| |       \
         ::. ) :        :
         |" (   \       |
         :.(_,  :       ;
          \'`-'_/      /
           `:..   , _,'
            |,|  : |
            |`|  | |
            |,|  | |
        ,--.;`|  | '..--.
       /;' "' ;  '..--. ))
       \:.___(___   ) ))'               SSt`-'-''
"
</pre>
Witout the tag it will be interpreted as:
,;::\::\ ,'/' `/'`/ _\,: '.,-'.-':. -./"' : : :\/, ::. ,:____;__; :- :" ( .`-*'o*',); \.. ` `---'`' / `:._..- _.' ,; . `. /"'| | \ ::. ) : : |" ( \ | :.(_, : ; \'`-'_/ / `:.. , _,' |,| : | |`| | | |,| | | ,--.;`| | '..--. /;' "' ; '..--. )) \:.___(___ ) ))' SSt`-'-'' "
Notes

Physical Styles

<b> ... </b> Bold
<i>... </i> Italic
<sub> ... </sub> Subscript
<sup> </sup> Superscript
<u> ... </u> Used to be "underline". Now defined as "text that should be stylistically different from normal text"
<s> ... </s> Used to be "strikethrough". Now defined as "text that is no longer correct"
<big> ... </big> Bigger print -- REMOVED from HTML5
<small> ... </small> Smaller print
List of HTML tags @ w3schools
Notes

Logical/Semantic Styles

<em> ... </em> Emphasize
<strong> ... </strong> More strongly emphasized than <em> </em>
<code> ... </code> Code sample
<cite>... </cite> Citation
<blockquote>... </blockquote> Quoting text
<address> ... </address> Address


<address>
     Reed College 3203 SE Woodstock Blvd. Portland OR <br />
     <a href="mailto:info@reed.edu"> info@reed.edu </a>
</address>

Interpreted by browser:
Reed College 3203 SE Woodstock Blvd. Portland OR
info@reed.edu
Notes

New in HTML5:

Notes