Beruflich Dokumente
Kultur Dokumente
All HTML documents must begin with the <HTML> tag. The following tags are also
necessary for a document to be HTML “legal:”
The following are examples of the different header sizes available to use for visual
structure on your Web page.
This is the code you would use for different size headers:
<H1>Example of H1 Header</H1>
<H2>Example of H2 Header</H2>
<H3>Example of H3 Header</H3>
<H4>Example of H4 Header</H4>
<H5>Example of H5 Header</H5>
<H6>Example of H6 Header</H6>
Example of H1 Header
Example of H2 Header
Example of H3 Header
Example of H4 Header
Example of H5 Header
Example of H6 Header
03/02/00 1
Paragraph Tag
Place a paragraph tag <P> at the start of every paragraph. The paragraph tag does not
need a closing tag. Below is an example:
<P>
This is a paragraph with the appropriate tags.
<P>
This is a second paragraph with the appropriate tags.
<P>
Break Tag
Create a break in the flow of text with the break tag <BR>. Below is an example:
Horizontal Rules are used to create a division in your text. No closing tag is needed.
Below is an example:
The above HTML tag will show as a horizontal line that is 95% across the page and is
aligned in the center.
03/02/00 2
List Tag
<UL>
<LI>Chocolate – YUM!
<LI>Chocolate – YUM, YUM!!
<LI>Chocolate – YUM, YUM, YUM!!!
</UL>
• Chocolate – YUM!
• Chocolate – YUM, YUM!!
• Chocolate – YUM, YUM, YUM!!!
<OL>
<LI>Carrots – YUCK!
<LI>Broccoli – YUCK, YUCK!!
<LI>Spinach – YUCK, YUCK, YUCK!!!
</OL>
1. Carrots – YUCK!
2. Broccoli – YUCK, YUCK!!
3. Spinach – YUCK, YUCK, YUCK!!!
You can nest bulleted or numbered lists to create a more outlined appearance to your text.
Below is an example of a bulleted list:
<UL>
<LI>HTML Tags:
<UL>
<LI>Body Tag
<LI>Horizontal Rule Tag
</UL>
<LI>More HTML Tags:
<UL>
<LI>Text Break Tag
<LI>Paragraph Tag
</UL>
03/02/00 3
This is how it will appear in your browser:
• HTML Tags
• Body Tag
• Horizontal Rule Tag
• More HTML Tags
• Text Break Tag
• Paragraph Tag
The Hanging Indent Tag can be used to give lines an indented appearance. The example
below could be used for glossary terms:
<D1>
<DT>You can create glossary terms
<DD>and define them
</D1>
<EM>emphasized</EM> or <I>italicized</I><BR>
<STRONG>more emphasized</STRONG> or <B>bold</B><BR>
<CITE>for titles and references</CITE><BR>
<TT>typewriter style (constant width font)</TT><BR>
emphasized or italicized
more emphasized or bold
for titles and references
typewriter style (constant width font)
03/02/00 4
Preformatted Text Tag
You can use the PRE tag when your text needs to be displayed in a particular format.
<PRE>
You can use the Preformatted Tag
to indicate
preformatted text
and accomplish
limited columns.
The text appears in a Courier font.
</PRE>
Creating a Blockquote
When you create a document and place it on the Web, it is your responsibility to meet the
legal and moral obligation to give credit to any other author whose words/ideas/research
you use.
<BLOCKQUOTE>The 1976 copyright law, which in 19 years has not been substantially
revised, is that quotations from published material should be cited in every instance.
Furthermore, if you quote more than fifty words from an article or more than 400 from a
book, you need permission from the copyright holder (sometimes a publisher, sometimes
an author), to use her or his material.</BLOCKQUOTE>
The 1976 copyright law, which in 19 years has not been substantially revised,
is that quotations from published material should be cited in every instance.
Furthermore, if you quote more than fifty words from an article or more than
400 from a book, you need permission from the copyright holder (sometimes
a publisher, sometimes an author), to use her or his material.
03/02/00 5
Address Tag
The address tag is used for signatures, address elements and authorship information.
You can link specified text to other documents in the same directory.
You can link specified courses such as ECN & PUCC Computer Short Courses, to other
documents upward in the same directory tree.
03/02/00 6
Creating Links to Another Machine
You can link to another machine at another site, for example: <A
HREF=http://www.ce.ufl.edu/”> University of Florida</A>.
You can link to another machine at another site, for example: University of Florida.
You can link to a specific point in another file by placing an HTML “target” tag in the
remote file and creating a link in the current file to the target tag in the remote file.
When you click on the link, you will jump directly to the location of the target tag in
description.html.
Inline Images
You can also use the Image Tag to <IMG SRC=”/images/MAPS/question.gif”> anchor
graphics.
03/02/00 7
Titles and Images
You can place a title with an image by using the following tags:
<p>
<IMG ALIGN=”Top” SRC=http://www.ecn.purdue.edu/images/bugs.gif>Top <BR>
<IMG ALIGN=”BOTTOM” SRC=http://www.ecn.purdue.edu/images/frog.gif>Bottom
<BR>
<IMG ALIGN=”Middle”
SRC=http://www.ecn.purdue.edu/images/services.gif>Middle<BR>
Top
Bottom
Middle
Linking an Image
03/02/00 8
Small Image Links to a Larger Image
03/02/00 9