Cascading Style Sheets (CSS); Backgrounds (part 1 of 2)
By Will Bontrager2003-10-10
An Application
Let's suppose you have a nice little image of a flower. You want it for a background, printed in a row along the top of your web page. The flowers should stay in their fixed position when the rest of the web page content scrolls.
It can be done this way:
<style type="text/css">
<!--
BODY {
background-image: url(flowers.jpg);
background-repeat: repeat-x;
background-attachment: fixed;
}
-->
</style>
Knowing how to use and position background images can enhance web page design.
See part two, next week, for ways to use background colors and images in the web page content itself.
Tutorial Pages:
» Introduction
» Now, let's see what you can do with CSS!
» Background Color
» Tiled Image
» Image Not Repeated, With Exact Positioning
» Background Image Repeated Across the Top of the Web Page
» Background Image Repeated Along the Left of the Web Page
» Background Image Does Not Scroll When Web Page Scrolls
» An Application
Copyright 2004 Bontrager Connection, LLC
