Creating a Web Page
Download
Report
Transcript Creating a Web Page
Creating a Web Page
HTML: The Language of the WEB
HTML
• To create a web page you use a special
language that Browsers can read.
Hyper Text
Markup
Language
The Web Browser
• is the software program on YOUR
computer
The Web Browser
• Can locate HTML documents on any server
anywhere in the world.
HTML Documents
• Simple TEXT documents.
• Created with a simple text editor
Some Text Editors
• The WordPad in Windows
– Start Accessories WordPad
• The NotePad in Windows
– Start Accessories NotePad
• MS WORD in Windows
Start an HTML document
<HTML>
•These are <TAGS>
•They tell the Browser that an
HTML document is coming.
</HTML>
Header Stuff
<HTML>
<HEAD>
<TITLE> My Page
</TITLE>
</HEAD>
•
Goes into the Blue line
•
A place for a title
Next comes the <Body>
<BODY>
This is the main part of your document.
</BODY>
Modifiers
• <BODY BGCOLOR=“006600”>
HTML Codes entered in a TEXT editor
<HTML>
< HEAD >
< TITLE >
< /TITLE >
< /HEAD >
< BODY >
</ BODY >
</HTML>
<HTML> tags indicate code is written
in HTML
< TITLE > tags identify the Title.
< HEAD > tags surround information
about the web page
< BODY > tags surround the portion of
the document that will appear in the
browser window.
SPACES . .The paragraph tag
• <P>
• </P>
• Adds extra
blank lines
before text to
separate it from
any text that
precedes it.
Section headings
<H1>
</H1>
• Makes the
headings BIG
and Black
and Bold
How Big???
This is <H1>
This is <H2>
This is <H3>
This is <H4>
This is <H5>
This is <H6>
Center It…Formats the heading
< H1 ALIGN=CENTER >
My favorite Sport.
< /H1 >
•Also try
< Center >
•Don’t forget to close the tag
</H1>
< H1 ALIGN = LEFT >
• Just use
<P>
</P>
• This is the
Default
Creating Lists
HTML supports
three kinds of
lists:
– Ordered lists
– Unordered lists
– Definition lists
Ordered Lists
a list in numeric order
My Favorite Movies
1. Mouse Hunt
2. Mary Poppins
3. Something about
Mary
Ordered Lists
<H3>My Favorite Movies</H3>
<OL>
<LI>Something About Mary
<LI>Mary Poppins
<LI>Mouse Hunt
</OL>
Unordered Lists
• Items have no particular order
Famous Male Actors
• Roy Rogers
• Gene Autry
• Hopalong Cassity
http://westerns.com/sounds/roy_rogers-west_is_in_my_soul.mp3
Unordered List bullet list
<H3>Famous Male Actors</H3>
<UL>
<LI>Roy Rogers
<LI>Gene Autry
<LI> Hopalong Cassity
</UL>
The Definition List
• A list of Terms followed by a definition line
Famous Movie Horses
– Topper
• Hopilong Cassidy’s horse
– Trigger
• Roy Roger’s Horse
– Champion
• Gene Autry’s Horse
Definition List
<H3>Famous Movie Horses</H3>
<DL>
<DT>Topper
<DD>Hopalong Cassity’s Horse
<DT>Trigger
<DD>Roy Roger’s Horse
<DT>Champion
<DD>Gene Autry’s Horse
</DL>
Character Tags
A <Tag> you apply to an individual
character.
2 Kinds
– Logical - how you use text
– Physical – how text looks
Logical Tags
<EM> Emphasized mode
• Indicates that characters should be
emphasized in some way..itallics
<STRONG>
• Emphasizes text more strongly than <EM>
Physical Character Tags
• How characters look
<B> bold
<I> Itallics
<BIG> big
<SMALL> small
<SUB> subscript
<SUP> superscript
Big BLACK Lines
• <HR> Horizontal Rule
• Adjust the WIDTH to ¾
<HR WIDTH=75%>
• Center the HR
<HR ALIGN=CENTER>
• Set the SIZE <HR SIZE=12>
More < HR > stuff
• Do it All in one HR TAG
<HR ALIGN=CENTER
SIZE=12
WIDTH=75%>
• Or
<HR ALIGN=CENTER SIZE=12 WIDTH=75%>