IMAGES
-
<img src = "imagename.gif" width="100" height = "200" alt = "Description of
image">
-
The following tags are not necessary but specifying them is good practice
-
width and height
will allow browser to "set aside" space for them while the page loads
-
alt will provide description of image for visually impaired
-
Other attributes such as align, hspace, vspace have been deprecated
IMAGES AS LINKS
-
Can make an image a link by nesting it in an <a> tag.
-
<a href = "http://www.google.com"><img src =
"myimage.gif"></a>
BACKGROUND
-
Can fill the background of a page with an image
-
<body background="imagename.gif">
-
CSS (style) provides more background control
SPECIFYING COLORS
EXAMPLE
PRACTICE
1. Experiment with the example above:
-
Add the align tag to the image and try different values: left, right, middle,
top, bottom.
-
Change the page so that the block is the background and the ball is the image.
-
Change the RGB value to make the line green. Then change the RGB value to make
the line blue.
-
Change the HEX code to make the line red. Then change it so that the line is
blue.
2. Create a home page that meets the following
requirements:
-
It has a banner across the top. You must create your own image.
Do NOT download an image.
-
It has a table of contents column on the left and the main
body on the right.
-
It has a background image. Create your own.
-
It has a small image that is a hyperlink. Create your own
image.
-
All images use the alt tag to describe the images.
3. Experiment with a Web Design tool.
-
How can you add an image?
-
Check out the properties for the image tag.
-
Set the background color of the page. Notice how you can set the color by
selecting or entering.
-
Set the basckground of the page to an image.
-
All images use the width and height tags.
SELF-QUIZ
