We start with the basic HTML containers: <HTML>, <HEAD>, <TITLE>, and <BODY>.
<HTML>
<HEAD>
<TITLE>Basic HTML Page</TITLE>
</HEAD>
<BODY>
Content goes here...
</BODY>
</HTML>
Now let's add some text to the body of the HTML document.
<HTML> <HEAD> <TITLE>Basic HTML Page</TITLE> </HEAD> <BODY> This is a short paragraph to demonstrate how HTML handles text. The most important thing to note is that extra space , tab, and return characters are ignored by HTML. The blank line above will become a single space when displayed. </BODY> </HTML>
HTML treats all text as one continuous paragraph until it comes to a paragraph "<P>" tag. By adding a "<P>" we divide the body of this page into two paragraphs.
<HTML> <HEAD> <TITLE>Basic HTML Page</TITLE> </HEAD> <BODY> This is a short paragraph to demonstrate how HTML handles text. <P>The most important thing to note is that extra space , tab, and return characters are ignored by HTML. The blank line above will become a single space when displayed. </BODY> </HTML>
Heading tags are used to give structure to a page. Headings come in different "sizes" from 1 to 6. It is good practice to use the the top level heading "<H1>" to repeat the page title at the beginning of the body. Major sections should use "<H2>" headings, subsections "<H3>" headings, and so on.
<HTML>
<HEAD>
<TITLE>Basic HTML Page</TITLE>
</HEAD>
<BODY>
<H1>Basic HTML Page</H1>
This is a short paragraph to demonstrate how HTML handles text.
<P>The most important thing to note is that extra space ,
tab, and return characters are ignored by HTML.
The blank line above will become a single space when displayed.
<H2>Second Section</H2>
Empty for now...
<H2>Third Section</H2>
Empty for now...
</BODY>
</HTML>
HTML documents can include pictures stored as separate files. These pictures are inserted in the text by the image "<IMG>" tag. This tag is unusual in that there is no closing "</IMG>" tag. The name of the picture file is included as part of the tag itself, in this case "picture.gif".
<HTML>
<HEAD>
<TITLE>Basic HTML Page</TITLE>
</HEAD>
<BODY>
<H1>Basic HTML Page</H1>
This is a short paragraph to demonstrate how HTML handles text.
<P>The most important thing to note is that extra space ,
tab, and return characters are ignored by HTML.
The blank line above will become a single space when displayed.
<H2>Second Section</H2>
<IMG SRC="picture.gif">
<H2>Third Section</H2>
Empty for now...
</BODY>
</HTML>
Now we are ready to add hypertext links to our file. The "<A>" anchor tags are used to enclose text (or images) to make "hot spots" in the document. Hot spots are indicated by color or other highlighting. Additional information about the link must appear just after the opening "<A>" tag. This usually takes the form of "HREF=URL" where URL is an address (in quotes) for the hypertext jump. The first example shows a hypertext link to a local file "example1.html" in the same directory as this one. The second example shows the use of a complete URL for both the hot text and link address.
<HTML>
<HEAD>
<TITLE>Basic HTML Page</TITLE>
</HEAD>
<BODY>
<H1>Basic HTML Page</H1>
This is a short paragraph to demonstrate how HTML handles text.
<P>The most important thing to note is that extra space ,
tab, and return characters are ignored by HTML.
The blank line above will become a single space when displayed.
<H2>Second Section</H2>
<IMG SRC="images/picture.gif">
<H2>Third Section</H2>
This is a <A HREF="example1.html">link</A> to an example file.<P>
Go to the <A HREF="http://www.med.ufl.edu/medinfo/mtx/">MTX home page</A>.
</BODY>
</HTML>