What do these tags do?
<html>
<body>
<h1> to <h6><hr>
Defines an HTML document
Defines the document's body
Defines HTML headings
Defines a horizontal line
<br>
<p>
<b> and <strong><i> and <em>
<code><sub><sup>
Allows you to put in a line break
Defines a paragraph
Text is bolded
Text is italicized
Text is formatted as subscript
Text is formatted as superscript
Text is formatted as computer output
Review of HTML
What do these tags do?
<a>
What is an external Link
What is an internal Link
Review of HTML
Defines a hyperlink (link)
A link to an outside website
A link to a current page in your website
What do these tags or attributes do do?
<img>
height and width
borderalt
Puts an image on the page
Adjust size of image
Adds a border to the image
Allows you to add a description of the image
You can control the color of your links in your <body> tag. These attributes are:link - Specifies the color of links that have not been visited vlink - Specifies the color of visited links alink - specifies color of currently active links
<HTML><HEAD><TITLE>Hyperlink Colors</TITLE></HEAD><BODY link="#0000FF” vlink="blue" alink="#FF0000"><a href="http://www.espn.com" target=“blank”>GO TO ESPN.COM</a></BODY></HTML>
Use the Save AS feature and save this into your student folder with your initials XXlinkcolor.html, open and view the document, it should look like this:
HTML Code: Changing Link Colors
Applying FontsThe <font> tag determines which font is applied to your text. By
itself, this tag has no effect on text. You specify the fonts as value of the face attribute.
<Font> - Tells computer you are going to modify the font
The face attribute allows you to change the font typeThe color attribute allows you to change the colorThe size attribute allows you to change the size of the font, the value ranges from 1-7
Lets Try it out
HTML Code: Applying Fonts
<HTML><HEAD><TITLE>Font Tag Attributes</TITLE></HEAD><BODY>Hello my name is <Font face="Tahoma" color="#99FF33" size="3">Keith</Font>.<BR>I am showing you how you can <Font face="Arial" color="#CC0099" size="4">change</Font> font color and size on your document.</BODY></HTML>Use the Save AS feature and save this into your student folder with your initials
XXfontattributes.html, open and view the document, it should look like this:
HTML Code: Adding Font Attributes
Write a brief 3 sentence paragraph describing your favorite food. Change the Font face for Paragraph 1, add Font color for Paragraph 2 and add Font size of 3 for Paragraph 3. Remember, you must open the font tag before each sentence and close at end of each sentence. Make the Title Font Example 1. Use a <br> tag at the end of each sentence.
<Font face=“font name” color=“hexadecimal #” size=“1-7”>
Use the Save AS feature and save this into your student folder with your initials
XXfontex1.html, open and view the document, mine looks like this:
HTML Code: Try It Yourself
An ordered list in HTML is like using a numbered list in a word processor. The <OL> tag tells the browser you are creating an ordered list, then you have an <LI> List Item tag for each individual item.<HTML><HEAD><TITLE>Ordered List</TITLE></HEAD><BODY>My Top 3 Movies Ever<OL><LI>Hoosiers<LI>The Natural<LI>Miracle</OL>
</BODY></HTML>
Use the Save AS feature and save this into your student folder with your initials XXOlist.html, open and view the document, mine looks like this:
HTML Code: Using Ordered Lists
An unordered list in HTML is like using a bulleted list in a word processor. The <UL> tag tells the browser you are creating an ordered list, then you have an <LI> List Item tag for each individual item.<HTML><HEAD><TITLE>Unordered List</TITLE></HEAD><BODY>My Top 3 Movies Ever<UL><LI>Hoosiers<LI>The Natural<LI>Miracle</UL>
</BODY></HTML>
Use the Save AS feature and save this into your student folder with your initials XXUlist.html, open and view the document, mine looks like this:
HTML Code: Using Unordered Lists
Create two lists on one HTML document. Make 1 list an ordered list about your favorite tv shows and 1 list an unordered list about your favorite tv characters. Make the Title Lists Examples.
Remember the Ordered List is <OL> and the Unordered List is <UL>
Use the Save AS feature and save this into your student folder with your initials
XXlistexamples.html, open and view the document, mine looks like this:
HTML Code: Try It Yourself
What are the 3 attributes to change link color?
What tag allows you to manipulate your text?
What attribute allows you to manipulate text type?
What attribute allows you to manipulate text color?
What tag allows you to create a numbered list?
What tag allows you to create a list item?
What tag allows you to create a bulleted list
HTML Review
Link, Alink and Vlink
<FONT>
face
color
<OL>
<LI>
<UL>