Once you have your graphic selected, you can use CSS to apply it to the page
and keep it from repeating vertically. You should set the background color
value to be complimentary with the lightest end of the gradient to give you
a visually pleasing transition.
So, for example, say the light end of the image is white, your CSS might be:
body {
background: url("/pathto/image.gif") #fff repeat-x;
}
Another technique you could use is to apply a fixed position on the graphic
to prevent it from scrolling. Not all browsers support this (at least NS4
doesn't) but I don't think it will cause you any problems. To implement
this, just add "fixed" as shown below. To see this technique in action:
http://www.w3schools.com/css/tryit.asp?filename=trycss_background-attachment
body {
background: url("/pathto/image.gif") #000080 repeat-x fixed;
}
For more info on CSS and backgrounds:
http://www.w3schools.com/css/css_background.asp