View
30
Download
1
Category
Tags:
Preview:
DESCRIPTION
WEB PAGES: CREATING AND MAINTAINING **. Wednesday: 10:15 -11:15. Instructor:. Frank Romanelli FrankR@Udel.Edu http://udel.edu/~frankr. Week 3. On ALL Web Pages. . Basic HTML Tags. On ALL Web Pages. - PowerPoint PPT Presentation
Citation preview
WEB PAGES: CREATING AND MAINTAINING **
Frank Romanelli
FrankR@Udel.Edu
http://udel.edu/~frankr
Instructor:
Wednesday: 10:15 -11:15
Week 3
Basic HTML Tags
<HTML> </HTML>
<HEAD> </HEAD>
<TITLE> </TITLE>
<BODY> </BODY>
On ALL Web Pages
Basic HTML Tags
<HTML> </HTML>
<HEAD> </HEAD>
<TITLE> </TITLE>
<BODY> </BODY>
On ALL Web Pages
<P> </P>
<BR>
<B> </B>
<I> </I>
<U> </U>
Formatting Tags
<SUB> </SUB> = Subscript e.g. H2O
<SUP> </SUP> = Superscript e.g. Today is September 23rd
H<sub>2</sub>O
Today is September 23<sup>rd</sup>
Basic HTML Tags
<HTML> </HTML>
<HEAD> </HEAD>
<TITLE> </TITLE>
<BODY> </BODY>
On ALL Web Pages
< P > < /P >
< BR >
<B> < /B >
< I > < /I >
<U> </U>
Formatting Tags
<SUB> </SUB>
<SUP> </SUP>
Basic HTML Tags
<HTML> </HTML>
<HEAD> </HEAD>
<TITLE> </TITLE>
<BODY> </BODY>
On ALL Web Pages
< P > < /P >
< BR >
<B> < /B >
< I > < /I >
<U> </U>
Formatting Tags
<SUB> </SUB>
<SUP> </SUP>
non-breaking spaceThis is one space, but this has extra spaces.
This is one space, but this has extra spaces.
Basic HTML Tags
<HTML> </HTML>
<HEAD> </HEAD>
<TITLE> </TITLE>
<BODY> </BODY>
On ALL Web Pages
< P > < /P >
< BR >
<B> < /B >
< I > < /I >
<U> </U>
Formatting Tags
<SUB> </SUB>
<SUP> </SUP>
Tag Options
<FONT> </FONT>
THE FONT TAG
SIZE = “1 … 7”
Tag Options
<FONT> </FONT>
THE FONT TAG
SIZE = “1 … 7”
<FONT size=“1”> <FONT size=“2”> <FONT size=“3”>
<FONT size=“4”> <FONT size=“5”> <FONT size=“6”>
<FONT size=“7”>
smallest
largest
This is LargeThis is <font size=“7”>Large</font>
Default
Tag Options
<FONT> </FONT>
THE FONT TAG
color = “16 standard colors”
<FONT color=“red”> aqua
black
blue
fuchsia
gray
green
lime
maroon
navy
olive
purple
red
silver
teal
white
yellow
This is: red and blue
This is: <font color=“red”>red</font> and <font color=“blue”>blue</font>
Tag Options
<FONT> </FONT>
THE FONT TAG
This is <FONT size=“7” color=“green”>Large & Green</FONT>
This is Large & Green
This is <FONT size=“7”><font color=“green”>Large & Green</font></FONT>
This is Large & Green
This is <FONT size=“7”><font color=“green”>Large & Green</font></FONT>
This is Large & Green only largeThis is <FONT size=“7”><font color=“green”>Large & Green</font>only large</FONT>
Tag Options
<FONT> </FONT>
THE FONT TAG
FACE = “name1, name2, name3, …”
These are different types of Font Faces
Tag Options
<FONT> </FONT>
THE FONT TAG
FACE = “name1, name2, name3, …”
• Browsers have VERY limited “Font Face” Support
• The “Font Face” file must reside on the Users Computer
• Name must match – might not look the same – MAC’s -PC’s
Tag Options
<FONT> </FONT>
THE FONT TAG
FACE = “name1, name2, name3, …”
These 12 fonts are installed on both PC and MAC
and are considered as ‘safe’
arial
arial black
comic sans ms
courier
courier new
georgia helvetica
impact
palatino
times new roman
trebuchet ms
verdana
Tag Options
<FONT> </FONT>
THE FONT TAG
FACE = “name1, name2, name3, …”
arial
arial black
comic sans ms
courier
courier new
georgia helvetica
impact
palatino
times new roman
trebuchet ms
verdana
cursive
fantasy
Serif
Sans-serif
monospace
Font-Family
Generic-Family
Tag Options
<FONT> </FONT>
THE FONT TAG
FACE = “name1, name2, name3, …”
arial
arial black
comic sans ms
courier
courier new
georgia helvetica
impact
palatino
times new roman
trebuchet ms
verdana
cursive
fantasy
Serif
Sans-serif
monospace
Font-Family
generic-Family
<FONT face = “verdana, helvetica, serif”>Hello</FONT>
Tag Options
<P> </P>
Paragraph Tag
ALIGN = “Left, Right, Center”
<P align=“left”>
<P align=“right”>
<P align=“center”>
Default
<P align=“center”>This text will be centered</P>
All of this text
is centered on the page
and this
is firetruck but only this
is italized.
<p align=“center”>All of this text<br>is centered on the page<br>
and this<br>is <font color=“red”>firetruck</font> but only this<br>is
<i>italized</i>. </p>
<H1…6> </H1…6>
THE HEADING TAG
<H1> </H1>
<H2> </H2>
<H3> </H3>
<H4> </H4>
<H5> </H5>
<H6> </H6> smallest
largest
HEADING
HEADING
<H4>HEADING</H4><H2>HEADING</H2>
Note!
• Opposite – Font Size• Always on it’s own line !
Tag Options
<H1…6> </H1…6>
THE HEADING TAG
ALIGN = “left, right, center”
This is Centered
This is left
This is right
<h2 align=“center”>This is centered</h2>
<h1align=“left”>This is left</h1>
<h2 align=“right”>This is right</h2>
Basic HTML Tags
<HTML> </HTML>
<HEAD> </HEAD>
<TITLE> </TITLE>
<BODY> </BODY>
On ALL Web Pages
<P> <BR>
<FONT> </FONT>
<H1>… <H6> to </H1>… </H6>
<B> </B>, <I> </I>, <U> </U>
<SUP> </SUP>, <SUB> </SUB>
Formatting Tags
<P align=“Left”> <P align=“Right”> <P align=“Center”><FONT size=“1…7” color=“color name” face=“name1, name2, name3, …>
Tag Options
Colors – aqua, black, blue, fuchsia, gray, green, lime, maroon,
navy, olive, purple, red, silver, teal, white, yellow
Recommended