07. HTML

Directions: HTML (H)yper (T)ext (M)ark-up (L)anguage is a type of programming language used to create web pages. AN HTML document can be created with a simple word processor like "Notepad" and saved as an .html file. When you finish writing the web page, you view the page in a browser like Internet Explorer. Review the following information to learn more about creating web pages.

  1. Review the following HTML tutorial to become familiar with creating web pages. HTML Tutorial

------------------------------------------------------------------------------------------

Example HTML Code Used for This Project

<html> This is the first command for a webpage. You leave this command turned on until the end of the webpage.

<head> The head command tells the browser to perform tasks that happen behind the scenes.
<title> This is an example head command. It shows a title at the top of the browser window.
Title Goes Here
</title> Turn off the title.
</head> The / is the command to turn of the head command.

<body bgcolor="#005500" background="image.jpg"> The body of the web page is the area where you put the information that you want to show up in the browser. The bgcolor attribute changes the background color of the web page. There is only one body command in a web page. It is turned off right before html is turned off. There are also attributes that describe the body command. Attributes are placed inside the tags with the command code. The following body attributes can be added to the body command. The background attribute creates a background with a picture.

bgcolor="#005500" sets the background color.
text="#005500" sets the text color.
link="#005500" sets the color of links.
vlink="#005500" sets the color of the visited links.
alink="#005500" sets the color of links on click.

<center> Center content on the web page until it is turned off.

<table width=660> Tables divide a web page into cells. Width tells the table to be 660 pixels wide.

<tr> Starts the first row of the table.

<td> Turns on a data cell.

</td> Turns off the first table data.

</tr> Turns off the table row.

</table> Turns off the table.

</center> Stops centering the table.

</body> Turns off the body.

</html> This is the last command for the webpage.

------------------------------------------------------------------------------------------

<br> Tells the browser to skip one line.

<p> Tells the browser to create a paragraph or skip two lines.

<b>bold words</b> Makes text bold until you turn it off. If you want a word to be <b>bold</b>, you would put a command at the exact point you want the bold lettering to start and another command where you want the bold lettering to stop. The / is used to turn off the command. Once a command has been turned on it will be in affect until it is turned off. The Command goes inside the and > tags.

<font size="+2">Text goes here</font> Change the font between -7 and +7.

<a href="writing/index.html">Writing</a> Creates a clickable link on the web page.

<img src="images/front.jpg"> Tells the browser to display a picture.

------------------------------------------------------------------------------------------

Color Chart

Hex Code Color
#FFFFFF  
#FFFFCC  
#FFFF99  
#FFFF66  
#FFFF33  
#FFFF00  
#FFCCFF  
#FFCCCC  
#FFCC99  
#FFCC66  
#FFCC33  
#FFCC00  
#FF99FF  
#FF99CC  
#FF9999  
#FF9966  
#FF9933  
#FF9900  
#FF66FF  
#FF66CC  
#FF6699  
#FF6666  
#FF6633  
#FF6600  
#FF33FF  
#FF33CC  
#FF3399  
#FF3366  
#FF3333  
#FF3300  
#FF00FF  
#FF00CC  
#FF0099  
#FF0066  
#FF0033  
#FF0000  

Hex Code Color
#66FFFF  
#66FFCC  
#66FF99  
#66FF66  
#66FF33  
#66FF00  
#66CCFF  
#66CCCC  
#66CC99  
#66CC66  
#66CC33  
#66CC00  
#6699FF  
#6699CC  
#669999  
#669966  
#669933  
#669900  
#6666FF  
#6666CC  
#666699  
#666666  
#666633  
#666600  
#6633FF  
#6633CC  
#663399  
#663366  
#663333  
#663300  
#6600FF  
#6600CC  
#660099  
#660066  
#660033  
#660000  
Hex Code Color
#CCFFFF  
#CCFFCC  
#CCFF99  
#CCFF66  
#CCFF33  
#CCFF00  
#CCCCFF  
#CCCCCC  
#CCCC99  
#CCCC66  
#CCCC33  
#CCCC00  
#CC99FF  
#CC99CC  
#CC9999  
#CC9966  
#CC9933  
#CC9900  
#CC66FF  
#CC66CC  
#CC6699  
#CC6666  
#CC6633  
#CC6600  
#CC33FF  
#CC33CC  
#CC3399  
#CC3366  
#CC3333  
#CC3300  
#CC00FF  
#CC00CC  
#CC0099  
#CC0066  
#CC0033  
#CC0000  

Hex Code Color
#33FFFF  
#33FFCC  
#33FF99  
#33FF66  
#33FF33  
#33FF00  
#33CCFF  
#33CCCC  
#33CC99  
#33CC66  
#33CC33  
#33CC00  
#3399FF  
#3399CC  
#339999  
#339966  
#339933  
#339900  
#3366FF  
#3366CC  
#336699  
#336666  
#336633  
#336600  
#3333FF  
#3333CC  
#333399  
#333366  
#333333  
#333300  
#3300FF  
#3300CC  
#330099  
#330066  
#330033  
#330000  
Hex Code Color
#99FFFF  
#99FFCC  
#99FF99  
#99FF66  
#99FF33  
#99FF00  
#99CCFF  
#99CCCC  
#99CC99  
#99CC66  
#99CC33  
#99CC00  
#9999FF  
#9999CC  
#999999  
#999966  
#999933  
#999900  
#9966FF  
#9966CC  
#996699  
#996666  
#996633  
#996600  
#9933FF  
#9933CC  
#993399  
#993366  
#993333  
#993300  
#9900FF  
#9900CC  
#990099  
#990066  
#990033  
#990000  

Hex Code Color
#00FFFF  
#00FFCC  
#00FF99  
#00FF66  
#00FF33  
#00FF00  
#00CCFF  
#00CCCC  
#00CC99  
#00CC66  
#00CC33  
#00CC00  
#0099FF  
#0099CC  
#009999  
#009966  
#009933  
#009900  
#0066FF  
#0066CC  
#006699  
#006666  
#006633  
#006600  
#0033FF  
#0033CC  
#003399  
#003366  
#003333  
#003300  
#0000FF  
#0000CC  
#000099  
#000066  
#000033  
#000000  




------------------------------------------------------------------------------------------