The White Ghost (nimoloth) wrote in s2expressive,
The White Ghost
nimoloth
s2expressive

How To Change Background Images (css)

The background of the page as a whole (i.e. under the central content strip) can be changed using the body tag:

body {
background-color: #fef9d2;
background-image: url("http://www.sampleurl.com/background.jpg");
background-repeat: repeat-x ;
background-attachment: fixed ;
}

In this case, I have used a gradient background, which is a thin vertical strip image repeated in the x-direction and fixed, with the underlying colour the same as the bottom of the gradient to blend in smoothly.

You can also change the background of the sidebar(s). Use:

.layout-wt #content-inner {
background-image: url("http://www.sampleurl.com/background.jpg");
}

.layout-tw #content-inner {
background-image: url("http://www.sampleurl.com/background.jpg");
}

These two will give you background images for single sidebar layouts on the right or left respectively. You can also use these to change the background colours of them. Again, you could use gradients if you like, remembering to specify the relevant positions and repeats of the background image strip.
Tags: how to:instructions, page:backgrounds, sidebar:backgrounds
Subscribe
  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    default userpic

    Your reply will be screened

  • 27 comments