HTML PowerPoint Day 4 (link to prior knowledge)hansenallatoona.weebly.com/.../2/9/7/8/29782159/html_powerpoint_… · Title: Microsoft PowerPoint - HTML PowerPoint Day 4 (link to

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

 



 and and 

<code>

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 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.

 - 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 Keith. I am showing you how you can change 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 tag at the end of each sentence.



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



face

color

<OL>

<LI>

<UL>

HTML PowerPoint Day 4 (link to prior knowledge)hansenallatoona.weebly.com/.../2/9/7/8/29782159/html_powerpoint_… · Title: Microsoft PowerPoint - HTML PowerPoint Day 4 (link to

Documents