CSS
body
{
background-color: #a3a47a;
font-family: Verdana, Arial, 'sans-serif';
width: 100%;
height: 100%;
margin: 0;
padding: 0;
font-size: 100.01%;
}
#header {
width: 100%;
min-width: 700px;
height: 50px;
background-color: #660000;
background-image: url(header.gif);
background-position: top center;
background-repeat: repeat-y;
}
#balken {
width: 100%;
min-width: 700px;
height: 30px;
background-color: #232523;
background-image: url(balken.gif);
background-position: top center;
background-repeat: repeat-y;
}
#content {
width: 660px;
margin: 0 auto;
padding: 20px;
background-image: url(content.gif);
background-repeat: repeat-y;
}
h1 {
font-family: 'Times new Roman';
text-align: center;
color: #f9e2c0;
margin: 0;
padding: 0;
font-weight: 500;
font-size: 1.6em;
line-height: 50px;
}
HTML
<body>
<div id="header">
<h1>Schatteneffekt mit Farbgrafiken</h1>
</div><!--Ende #header-->
<div id="balken">
</div><!--Ende #balken-->
<div id="content">
Contentinhalt
</div><!--Ende #content-->
</body>