HTML Blueprints | index | prev | next | view | peek |

Plan 2:
HTML for formatting text

Here the basic HTML tags you will use for formatting text. For you web pages, your may will be more interesting!

HTML
NOTES
<html>
<head>
<title>HTML for Text</title>
</head>
<body>
Header and Body
<H1>Header level 1</H1>
<H2>Header level 2</H2>
<H3>Header level 3</H3>
<H4>Header level 4</H4>
<H5>Header level 5</H5>
<H6>Header level 6</H6>
Section Headings for text from most significant <h1> to least <h6> Note that will you control the relative size, the exact font and size is selected by the viewer.

As an option <Hn align=center>The heading</Hn> will center align the header.

<hr>



<hr size=5 width=40%>
Hard Rule separator. Draws a horizontal line across the page.

For NetScape users, other options include <hr size=x width=ZZ%> where x is the number of pixels for the thickness of a line and ZZ is a percentage of the page width

Four score and seven years ago.
A whole bunch of text. 
  Ipso factso.

Four score and seven years ago.
<p>
A whole bunch of text.
<p> 
Ipso factso.

Four score and seven
years ago.
<br>
A whole bunch of text.
<br> 
Ipso factso. 
Body text. In the first block, any typed carriage returns are ignored. In the second block, <p> tag forces a blank line and then new paragraph. And in the third the <br> tag forces a break to a new line but does not insert a blank line.
<BLOCKQUOTE>
Four score and seven years ago.
A whole bunch of text. 
Ipso factso.
</BLOCKQUOTE>
For an extended quotation, the <BLOCKQUOTE> indents the margins and sandwiches the text with white space.
<B>Four score and seven
years ago.</B>
<br>
<I>Four score and seven
years ago.</I>
<br>
<TT>Four score and seven
years ago.</TT>
Style tags for Bold, Italic, and Typerwriter (mono-space font)
<B><I>Four score</I> 
and <TT>seven</TT>
years ago.</B>
You can also combine the style tags for Bold-Italic. Note how the style tags are "nested" inside each other.
<h2><I>Four score</I> 
and seven years ago.</h2>
A whole bunch of text. 
Ipso factso. Ipso factso. Ipso factso.

Style tags can also be used inside Header tags
<pre>
Four score 
   and seven
     years ago.

A whole bunch of text. 
</pre>

Preformat pays attention to space charatcers and carriage returns. The font used is a mono-spaced font. This could be used for displaying computer programs, tables of text or data, etc.
<ol>
<li>Four score
<li>and seven years ago.
<li>A whole bunch of text. 
<li>Ipso factso.
<li>Ipso factso.
</ol>

Ordered List. List of items, each gets numbered in ascending order.

Options for NetScape include each item marked with <ol TYPE=A> capital letters, <ol TYPE=A> small letters, <ol TYPE=I> large Roman numerals, <ol TYPE=i> small roman numerals. Also, you can designate what number/letter st start with (if your list should not start with 1) by using <ol START=5> which will start a list with 5, E, e, V, v depending on the TYPE tag.

<ul>
<li>Four score
<li>and seven years ago.
<li>A whole bunch of text. 
<li>Ipso factso.
<li>Ipso factso.
</ul>
Un-Ordered list of items. Each item is marked by a bullet mark
<ul>
<li>Four score
<li>and seven years ago.
<li>A whole bunch of text. 
  <ol>
  <li>Ipso factso.
  <li>Ipso factso.
</ol>
<li>Ipso Factso.
</ul>
Nested list. You can create lists inside of lists to create outlines
<dl>
<dt>Four score and seven years ago.
<dd>Ipso factso.Ipso factso.
<dt>A whole bunch of text. 
<dd>Ipso factso. Ipso factso.
</dl>
Defintion List. Each <dt> tag marks the name of an item and the <dd> tag indents the text for a description
<font size=+4>F</font>
<font size=+3>our 
score and seven years ago.</font><br>
<font size=+1>A whole</font> 
<font size=+2><B>bunch</B></font>
<font size=+1> of text. </font><br>
<font size=-1>Ipso factso.</font>
NetScape tag for chanign the size of text
</body>
</html>


View this web page