So what is CSS, Cascading Style Sheets?
The idea behind CSS is to separate design and page content, and this is a good thing since it makes life simpler and the page more consistent. A good page that illustrates this in a nice looking way is http://www.csszengarden.com/.
Let's start to change the colors, into something different like black and amber. And to do this we need a css file.
Filename: screen.css
body {
/* Page background color = black */
background: #000000;
/* Textcolor = amber */
color: #FFBF00;
}
And then we add a link to it in the page object.
Filename: class.page.php
<?php
class page
{
function __construct($title)
{
print "<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\">\n";
print "<html>\n";
print "<head>\n";
print " <title>".$title."</title>\n";
print " <link rel=\"stylesheet\" title=\"std\" ".
" media=\"screen\" href=\"screen.css\" type=\"text/css\">\n";
print " <meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\">\n";
print "</head>\n";
print "<body>\n";
}
function __destruct()
{
print "<hr>\n";
print "<a href=\"first.php\">The first page</a><br>\n";
print "<a href=\"second.php\">The second page</a><br>\n";
print "</body>\n";
print "</html>\n";
}
}
?>
Notice that the pages that is calling still don't need to be modified at all, but when you view them they will have different colors.
Filename: first.php
<?php
require_once("class.page.php");
$page = new page("My first page...");
?>
<h1>Hello</h1>
<p>What a nice little page</p>
Filename: second.php
<?php
require_once("class.page.php");
$page = new page("And the second page...");
?>
<h1>Hello again.</h1>
<p>Just another page.</p>
How nice to only have 1 file you need to edit if you like to change the colors, just imagine to have a big site with thousands of file and you need to change the background color by editing all the thousand files individually...