Htmlsamples

SAMPLES OF HTML TAGS
Standard Document Outline
All HTML documents must begin with the <HTML> tag. The following tags are also
necessary for a document to be HTML “legal:”
<HTML> HTML Document

<HEAD> Header Section of HTML Document begins.
<TITLE> The title entered here appears in the title bar of the browser
window.
</TITLE> This ends the title section.
</HEAD> This ends the header section of the HTML document.
<BODY> The body contains all visible parts to the page. These
include text, .gifs, links, tables, forms, etc.
</BODY> Closing body tag
</HTML> Closing HTML tag
Page Heading Tag
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>
This is how the above code will appear in your browser:
Example of H1 Header
03/02/00 1
Paragraph Tag
Place a paragraph tag at the start of every paragraph. The paragraph tag does not
need a closing tag. Below is an example:

This is a paragraph with the appropriate tags.

This is a second paragraph with the appropriate tags.

Break Tag
Create a break in the flow of text with the break tag . Below is an example:
All That is Gold 

by J.R.R. Tolkien

All that is gold does not glitter, 
Not all those who wander are lost; 
The old that is strong does not wither, 
Deep roots are not reached by the frost. 
From the ashes a fire shall be woken, 
A light from the shadows shall spring; 
Renewed shall be blade that was broken, 
The crownless again shall be King. 
Horizontal Rule Tag
Horizontal Rules are used to create a division in your text. No closing tag is needed.
Below is an example:
<HR WIDTH="95%" ALIGN=CENTER>
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
The List Tag is used to create an ordered or unordered list.
Below is an example of a list code that produces a bulleted list:
<UL>
<LI>Chocolate – YUM!
<LI>Chocolate – YUM, YUM!!
<LI>Chocolate – YUM, YUM, YUM!!!
</UL>
This is how it will appear in your browser:
• Chocolate – YUM!
• Chocolate – YUM, YUM!!
• Chocolate – YUM, YUM, YUM!!!
Below is an example of a list code that produces a numbered list:
<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
• HTML Tags
• Body Tag
• Horizontal Rule Tag
• More HTML Tags
• Text Break Tag
• Paragraph Tag
Hanging Indent 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>
You can create glossary terms

and define them.
Emphasizing Text Tag
You can change text to appear:
emphasized or italicized 
more emphasized or bold 
<CITE>for titles and references</CITE> 
<TT>typewriter style (constant width font)</TT> 
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>
You can use the Preformatted Tag

to indicate
preformatted text
and accomplish
limited columns.
The text appears in a Courier font.
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.
<ADDRESS>Last Modified: November 24, 1998

webmaster@ecn.purdue.edu</ADDRESS>
Last Modified: November 24, 1998 webmaster@ecn.purdue.edu
Creating Links in Same Directory
You can link specified <A HREF=”sample.doc.html”> text</A> to other documents in

the same directory.
You can link specified text to other documents in the same directory.
NOTE: The underscored text is a link to the sample.doc.html file.
Creating Links Upward in Directory Tree
You can link specified courses such as <A HREF=”…/B.NOTES/16.short.course.html”>

ECN & PUCC Computer Short Courses</A>, to other documents upward in the same
directory tree.
You can link specified courses such as ECN & PUCC Computer Short Courses, to other
documents upward in the same directory tree.
NOTE: The underscored text is a link to the 16.short.course.html file.
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.
NOTE: The underscored text is a link to the http://www.ce.ufl.edu file
Link to Specific Point in Another File
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.
Current File: <A HREF=”description.html#xstart”> Learning to Use

XSTART</A>
Remote File must include the HTML tag:

<A href =”#XSTART”> Learning To Use XSTART</A>
Current File: Learning To Use XSTART
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.
You can also use the Image Tag to anchor graphics.
03/02/00 7
Titles and Images
You can place a title with an image by using the following tags:

<IMG ALIGN=”Top” SRC=http://www.ecn.purdue.edu/images/bugs.gif>Top 
<IMG ALIGN=”BOTTOM” SRC=http://www.ecn.purdue.edu/images/frog.gif>Bottom
 
<IMG ALIGN=”Middle”
SRC=http://www.ecn.purdue.edu/images/services.gif>Middle 
Top
Bottom
Middle
Linking an Image
<A HREF=http://www.happy.com/smileyfaces.html><IMG ALIGN=BOTTOM

SRC=http://www.happy.com/images/wry.gif></A>This is a graphic link.
This is a graphic link.
03/02/00 8
Small Image Links to a Larger Image
<A HREF=”/images/cartoons.gif”> <IMG SRC=”/images/group/sorcerer.gif”

ALIGN=”BOTTOM”></A>This small image links to another larger image.
This small image links to another larger image.
03/02/00 9

Htmlsamples

Загружено:

Сведения о документе

Исходное описание:

Оригинальное название

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Htmlsamples

Загружено:

Авторское право:

Доступные форматы

SAMPLES OF HTML TAGS

Standard Document Outline

<HTML> HTML Document

Page Heading Tag

This is how the above code will appear in your browser:

All That is Gold <BR>

Horizontal Rule Tag

<HR WIDTH="95%" ALIGN=CENTER>

The List Tag is used to create an ordered or unordered list.

Below is an example of a list code that produces a bulleted list:

This is how it will appear in your browser:

Below is an example of a list code that produces a numbered list:

This is how it will appear in your browser:

Hanging Indent Tag

This is how it will appear in your browser:

You can create glossary terms

Emphasizing Text Tag

You can change text to appear:

This is how it will appear in your browser:

This is how it will appear in your browser:

You can use the Preformatted Tag

This is how it will appear in your browser:

<ADDRESS>Last Modified: November 24, 1998

This is how it will appear in your browser:

Last Modified: November 24, 1998 webmaster@ecn.purdue.edu

Creating Links in Same Directory

You can link specified <A HREF=”sample.doc.html”> text</A> to other documents in

This is how it will appear in your browser:

NOTE: The underscored text is a link to the sample.doc.html file.

Creating Links Upward in Directory Tree

You can link specified courses such as <A HREF=”…/B.NOTES/16.short.course.html”>

This is how it will appear in your browser:

NOTE: The underscored text is a link to the 16.short.course.html file.

This is how it will appear in your browser:

NOTE: The underscored text is a link to the http://www.ce.ufl.edu file

Link to Specific Point in Another File

Current File: <A HREF=”description.html#xstart”><STRONG> Learning to Use

Remote File must include the HTML tag:

This is how it will appear in your browser:

Current File: Learning To Use XSTART

This is how it will appear in your browser:

You can also use the Image Tag to anchor graphics.

This is how it will appear in your browser:

<A HREF=http://www.happy.com/smileyfaces.html><IMG ALIGN=BOTTOM

This is how it will appear in your browser:

This is a graphic link.

<A HREF=”/images/cartoons.gif”> <IMG SRC=”/images/group/sorcerer.gif”

This is how it will appear in your browser:

This small image links to another larger image.

Вам также может понравиться