Now we have applied a background tint to the body area of the document. The content of the body area has been centered on the page, and that content now includes an image (which we’ve given a two-pixel-wide border), a heading and a subheading, a simple table, and some text.
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<title>A Simple HTML Document</title>
</head>
<body bgcolor=”#cccccc”>
<center>
<img src=”cathedral.jpg” border=”2” alt=”Cathedral” />
<h1>Guide to Seville</h1>
<h3>A brief guide to the attractions</h3>
<table border=”2”>
<tr>
<th bgcolor=”#aaaaaa”>Attraction</th>
<th bgcolor=”#aaaaaa”>Description</th>
</tr>
<tr>
<td>Cathedral</td>
<td>Dating back to the 15th century</td>
</tr>
<tr>
<td>Alcazar</td>
<td>The medieval Islamic palace</td>
</tr>
</table>
<p>Enjoy your stay in beautiful Seville.</p>
</center>
</body>
</html>
First, we used the BGCOLOR property of the <body> tag to provide the overall background tint for the page:
<body bgcolor=”#cccccc”>
Everything in the body area is contained between the <center> tag (immediately after the body tag) and its partner </center>, immediately before the closing body tag. This ensures that all of our content is centered on the page. The main heading is enclosed in <h1> … </h1> tags as previously, but is now followed by a subheading using <h3> … </h3> tags to provide a slightly smaller font
size.
By using the border property in our opening <table> tag, we set a border width of two pixels for the table:
<table border=”2”>
Meanwhile we darkened the background of the table’s header cells slightly by using the BGCOLOR property of the <th> elements:
<th bgcolor=”#aaaaaa”>Vegetables</th>
Posted in 
Tags: 
