The purpose of the <div> tag is to define an area on the page that is used for a specific purpose. The <div> areas specify not only major areas, such as headers or sidebars, but also smaller areas, such as box-outs (separate boxes filled with information) that contain additional information. Inside the <div> and </div> tags, the relevant code for that area is added.
<div id="header">
</div>
<div id="main">
</div>
<div id="footer">
</div>
The first step, before you even think about creating any code, is to get an idea of how your page will be structured. Start by knowing the basic sections of your pages. If you look at Figure A-3, you can see several distinct areas:
■ At the top of the page is a consistent gray area that contains the name of the
site.
■ Below the top area is a menu bar.
■ A gray sidebar is on the left side of the page. This area is useful for information relevant to the main content.
■ The main body of the page is where the content will be displayed.
To see an example of this, create a file called header.php and add the following header code:
<?php
require("config.php");
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<title><?php echo $config_sitename; ?></title>
<link href="stylesheet.css" rel="stylesheet">
</head>
<body>
