Unsere Seite bekommt einen Header

Unsere Homepage soll einen Header erhalten, in den wir z.B. den Homepage-Titel reinschreiben können, und der ggf. auch eine Grafik sowie noch andere Elemente enthalten kann.
Greifen wir auf unsere "index.html" zurück und setzen die Überschrift in einen Header.

Wer noch das Kapitel Div's & Tricks in Erinnerung hat, sollte das bereits selbst können. Aber zur Sicherheit noch einmal für alle:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Meine erste CSS-Seite</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="header">
<h1>Meine erste CSS-Seite</h1>
</div> <!--Ende header-->
<a href="seite1.html">CSS Teil 1</a>
</body>
</html>

Falls ihr diese Seite jetzt abspeichert und wieder aufruft, werdet ihr keinerlei Überraschungen erleben. Dazu müsst ihr in der "style.css" erst wieder einige Definitionen hinterlegen.
Unser Header soll einen andersfarbigen Hintergrund und einen Rahmen erhalten. Wir öffnen also die "style.css" und fügen folgendes ein:

#header
{
background-color: #FFCC00;
border: 2px solid #990000;
}

Abspeichern und ansehen: Das sollte einer Homepage jetzt schon etwas ähnlicher kommen.

Was es mit "border" auf sich hat erfahrt ihr im nächsten Kapiel wo es um Rahmen geht.


Um einen Link zu setzen, der direkt auf diese Seite führt, verwende folgende Url: