180 likes | 407 Views
HTML 101. 10 Minute University Richard Fisher. HTML Overview. HTML HyperText Markup Language. HTML Overview. Word Processing: W Y S I S Y G What You See Is What You Get HTML: W Y S L C D T W Y G What You See Looks Completely Different Than What You Get. HTML Overview.
E N D
HTML 101 10 Minute University Richard Fisher
HTML Overview • HTML • HyperText Markup Language HTML 101 -- FSA Training
HTML Overview Word Processing: W Y S I S Y G What You See Is What You Get HTML: W Y S L C D T W Y G What You See Looks Completely Different Than What You Get HTML 101 -- FSA Training
HTML Overview • HTML documents contain • Content (“the words”) • HTMLCommands (TAGS) • HTMLTAGS • Enclosed in brackets< B > • Either upper or lower case • Usually come in pairs • Second TAG has a / (slash) before it’s command • Example of boldTAG: <B> bold text </B> HTML 101 -- FSA Training
Sections of HTML Document <HTML> <HEAD> Heading info goes here </HEAD> <BODY> Body info goes here </BODY> </HTML>
<TITLE> . . . </TITLE> Indicates the title of the document In the Heading section Displays in the browser’s Title Bar HTML Titles HTML 101 -- FSA Training
Add Title:Alice’s Palace(Shows on Menu Bar) <HTML> <HEAD> <TITLE>Alice's Palace</TITLE> </HEAD> <BODY> </BODY> </HTML> HTML 101 -- FSA Training
<H1> . . . </H1> Browser displays headings in bold font and puts a blank line before and after an HTML heading A first-level heading <H1> is largest Smallest heading is <H6> Headings Tags HTML 101 -- FSA Training
Add Text: Welcome All(with H2 Heading) <HTML> <HEAD> <TITLE>Alice's Palace</TITLE> </HEAD> <BODY> <H2>Welcome All</H2> </BODY> </HTML> HTML 101 -- FSA Training
HTML does not recognize spacing unless specified <BR> Carriage break Returns text to left margin <P>End of paragraph blank line and returns text to left margin Spacing HTML 101 -- FSA Training
Add Text:My name is Alice(with carriage break) <HTML> My name is Alice <HEAD> <TITLE>Alice's Palace</TITLE> </HEAD> <BODY> <H2>Welcome All</H2> <BR> </BODY> </HTML> HTML 101 -- FSA Training
Add Text:I live in Dallas(with paragraph break) <HTML> My name is Alice <HEAD> <TITLE>Alice's Palace</TITLE> </HEAD> <BODY> <H2>Welcome All</H2> <BR> I live in Dallas <P> </BODY> </HTML> HTML 101 -- FSA Training
Images <IMG SRC=”imagefilename"> URL (name and location) of the image <IMG SRC="dallas.gif">(images is folder – dallas.gif is the graphics file) or <IMG SRC=”http://www.myname.com/images/dallas.gif"> HTML 101 -- FSA Training
Add Image: <HTML> My name is Alice <BR> <HEAD> <TITLE>Alice's Palace</TITLE> </HEAD> <BODY> <H2>Welcome All</H2> I live in Dallas <P> <IMG SRC=“images/dallas.gif"><BR> </BODY> </HTML> HTML 101 -- FSA Training
Links <A HREF=“….”> hotlink name </A> Creates a link to another document or hypermedia file Example <A HREF="http://www.utdallas.edu">UTD</A> HTML 101 -- FSA Training
Add Link:I attend college at UTD <HTML> My name is Alice <HEAD> <TITLE>Alice's Palace</TITLE> </HEAD> <BODY> <H2>Welcome All</H2> <BR> I live in Dallas <P> <IMG SRC=“images/dallas.gif"><BR> I attend college at <A HREF="http://www.utdallas.edu">UTD</A> </BODY> </HTML> HTML 101 -- FSA Training
HTML Reference • Quick Reference Sheet (Reference Room) • Tons of Web References including • Bare Bones Guide to HTML http://werbach.com/barebones/ HTML 101 -- FSA Training
The End Questions ? HTML 101 -- FSA Training