All you ever needed to know…and more!
All you ever needed to know…and more!. H.T.M.L. HyperText Mark-up Language Web’s programming language All web browsers Set of instructions Written with.
Jan 13, 2016
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
All you ever needed to know…and more!
H.T.M.L.
HyperText Mark-up Language Web’s programming language All web browsers Set of instructions Written with tags
(special codes) Make web sites
TAGS
Beginning tag <>
Ending tag </>
Example:<H1>HELLO</
H1>
HEADINGS
Change font sizes H1=largest H2 H3 H4 H5 H6=smallest
Appearance tags (how fonts look)
<b>=bold <I>=italics <u>=underline <blink>text</blink>
*To combine heading & appearance:
<h2><I>This is cool!</h2></I>
This is cool!
Line Formatting
<p>=new paragraph
<br>=line break (spacing)
<hr>=horizontal rule
<p align=center>= paragraph alignment
SAMPLE PAGE
What the beginning of a page looks like: <html> <head> <title>Everything About Me</title> </head> <body bgcolor=“blue” text=“white”> <h1>My name is Alice Lingo</h1> etc.
Each tag needs to be on a separate line
Ending tags
</body> Ends body of web page
</html> Ends entire page
*These tags must be at the end of every page!
How to start programming Open notepad Beginning tags Add info Save as:
filename.html Changes to a web
browser file
Open in explorer View sample page
Practice Time…
Open notepad Use beginning tags Add 2 lines of text Ending tags Save and browse
BACKGROUND & font COLORS Add after </head> tag <body bgcolor=“blue” text=“white”>
Other tags
Ordered list (numbered) <h3>My Favorite
Places</h3> <OL>=indicates beginning of list <LI>Orlando <LI>Hawaii <LI>North Clarion </OL>=indicates end of list
Unordered List (bulleted) Same, but change <OL>
to <UL> Save and view
Advanced tags
Change font size and type Under body tag or with it
<font size=“30” face=“Comic Sans MS”> </font>
Save & view
ADVANCED TAGS Insert images & change their size
Place tag where you want picture to appear <img src=“filename.ext” width=“100” height=“100”> </img>
Save & view
ADVANCED TAGS Link pages to another site
Place tag where you want link to appear <a href=“www.wal-mart.com>WalMart</a>
Save & view
ADVANCED TAGS Link your pages together
<a href=“file:///h|/pets.html”>My Pet Page</a>
Save & view
ADVANCED TAGS Insert picture instead of text for links
<a href=file:///h|/pets.html><img src=“samspup_small.jpg”></img></a>
Save & view
ADVANCED TAGS Use picture as background
<body background=“filename.ext”> Instead of <body bgcolor…> End with same tag </body> at bottom
Save & view
WEB PAGE PROJECT
Create a web site about yourself Must have at least 4 pages Hyperlinks
3 links to favorite web sites All pages linked back and forward
Ordered or Unordered list Horizontal rules Clipart, Fonts and backgrounds used
*Make sure all fonts are visible and readable; check spelling and links!!
Beginning tags <HTML>
must be at the top and bottom of every web page
Indicates beginning and end of an HTML
<head> contains info about the web page
<title>name of web site</title> Title of your web page
Blue title at top
</head> Ends heading info
Related Documents
