Jump to content

Recommended Posts

I have 5 pages that are attached to the same styles.css document, now everything is cool but i want to use different background image for every document. I have no idea how to do this, maybe it's not even possible :( any help would be appreciated.

thanks...

Link to comment
Share on other sites


What you'd have to do is define a different class or id for each tag and page that has a different background. For example, if the background image is defined in the body tag, via css, you'd have to give each page's body tag a different id/class. The difference between id and class is that ids only show up once in html/css whereas classes can be defined for multiple tags. Also in plain html ids can be used for other attributes. And the advantages of classes is you can easily assign css classes to any tag with javascript (className='something'). Anyway, here's an example that I hope helps.. And I'm happy to help more if you're stuck. Also, check out this resource on how the background css thing works. :)

html pages:

Page 1:
...
</head>
<body id="page1">
...

Page 2:
...
</head>
<body id="page2">
...

Page n:
...
</head>
<body id="pageN">
...

style.css

#page1 {
background: url(images/page1bg.jpg) no-repeat;
}
#page2 {
background: url(images/page2bg.jpg) no-repeat;
}
#pageN {
background: url(images/pageNbg.jpg) no-repeat;
}

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...