|
|||||||||
|
|||||||||
| |||||||||
|
|||||||||
|
|||||||||
| |||||||||
|
|
|
| |||||||||
 |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
Dev Shed Forums Sponsor:
|
|
#1
July 16th, 2002, 10:08 PM
|
|||
|
|||
|
background image
I have managed to create a collage that I want to use as a background image on my web site, the only problem is it tiles because it is smaller than the window size. Is there a way to stop it from tiling and just remain in the middle of the page. I'm a novice at this web page thing so I have no clue. Please help!
thanks
|
|
#2
July 17th, 2002, 08:34 AM
|
|||
|
|||
|
You can use a table with the dimensions of your image and use background="yourimage.jpg"
or you can use style sheets Mantas
|
|
#3
July 17th, 2002, 01:15 PM
|
||||
|
||||
|
Another approach that may work depending on the image size, page content, and a few other factors, would be to increase the image size so that it doesn't repeat. This won't work at all if your image is relatively small, but can be decent cross-browser compatible way to go under certain circumstances.
For example, at one place I worked they wanted to use the background image to place a sort of graphical hearder at the top of the page. The image was about 800X150. As it was it titled vertically down the page, and horizontally if the res was higher that 800x600. What we ended up doing was adding white space to the right-side and bottom so that the image was 1200X3600. Now this may sound huge, but once it was turned into a .gif the file size was very manageable (was under 10k if I recall correctly). The only thing we really needed to be careful of was making a page longer than 3600 pixels vertically, which wasn't a huge problem because our guidelines for page construction stipulated that 66% or more of the content should be "above the fold" on 800X600 display. wdn2k
|
|
#4
July 18th, 2002, 06:10 PM
|
|||
|
|||
|
I recommend stylesheets. You can use this:
<body style="background-image:url(image.jpg); background-repeat: no-repeat; background-position: center center;"> If you'd like you can add background-attachment: fixed; to the list of properties between the quotes above and your background image won't scroll with the rest of your page. Be careful, though. Stylesheets, though they have been around for quite a while, are implemented differently in different browsers, especially older ones. Some style properties may not work exactly like you want them to. Good Luck!
|
|
| Viewing: Dev Shed Forums > Web Design > Web Design Help > background image |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
 |
|
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
