Adding text to your first web page is exciting. But to make
a web site look the way that you want, you need to know how to change the
colors of the text or background and how to add pictures and links. Fortunately,
this is almost as easy as adding the tags you've already learned.
Changing Colors
Colors in HTML are defined by a 6-digit hexadecimal number
that represents the amount of red, green, and blue. Some colors also
have names. For a list of named colors supported by major browsers, click here.
The background color can be changed by adding the desired color
to the body tag.
<body style="background-color:aqua">
The text color can be changed by adding the style tag to the
desired paragraph.
<p style="color:green;">This text is green.
To change the color of text that is shorter than a paragraph,
just put the style tag inside a span tag.
<span style="color:red">This text is red.</span>
Another way of adding colors is with a style sheet. Style
sheets keep track of the colors, fonts, and sizes for the page. They are very
useful for using multiple pages with the same format. Styles sheets are beyond
the scope of this blog-entry, but may be a topic for a future one if there is
sufficient interest.
Adding Images and
Links
Adding a link to a website can be done with this tag.
<a href="url to link">link text</a>
Adding images is pretty much the same.
<img src="picture.jpg" height=150 width=150>
Here, the size of the picture is defined here by the width
and the height in pixels. Defining just the height or width keeps the same
ratio as the original picture. Note that the picture.jpg needs to be the location
where the image is stored. Upper and lowercase letters matter.
Troubleshooting
As explained in the previous blog entry in this series, most
HTML problems are due to a spelling error or a misplaced or forgotten bracket.
The same is true when you're trying to change the colors of the text or
background, or trying to add pictures and links. If you're having a hard time,
look for common problems first.
Editor's Note: Click
here for Part 1 of this series.
| 
Re: Basic HTML: Images, Links, and Colors.
