Sample Page with background-repeat:repeat-x
This sample page uses an image across the top of the page only.
Here is the image by itself:
I made 2 classes for this:
.metal {background-image:url(../bg/Ancient_Metal.jpg);
background-repeat:repeat-x;
}
.metal_text {
width:100%
text-align:center;
font-size:33pt;
color:#ffffdd
}
.metal tiles the image across the top of the page. It goes in my body tag:
<body class="metal">
.metal_text declares special text to be used as in a header on top of the background only:
<h1 class="metal_text">Sample Page</h1>
I could also use this class in a div with a fixed height anywhere on the page, like so:
<div style="width:100%; height:128px;" class="metal">
<p class="metal_text">
text
</p>
</div>
Happy coding!
Gnubee
