#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    5
    Rep Power
    0

    CSS: simple question


    Hello

    div
    {
    background-image:url("xxx.jpg");
    text-color: #FFFFFF;
    position:relative;
    overflow: visible;
    }

    - This will make all the <DIV>'s on my site contain these values. How do I create two <DIV>'s with different properties? Do I have to use external stylesheets or is there another way around? Please help.
  2. #2
  3. Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Location
    Rochester, NY
    Posts
    20
    Rep Power
    0
    I don't know if this would work, but you could try making classes and then in a div tag say <div class="CLASS NAME">. This is only a guess, I have never tired it before.
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    22
    Rep Power
    0
    Yeah, if you are asking what I think you are, classes should work.

    in your stylesheet, you defined divs to have background xxx.jpg

    div
    {
    background-image:url("xxx.jpg");
    text-color: #FFFFFF;
    position:relative;
    overflow: visible;
    }

    suppose you wanted to produce a few divs with a background yyy.jpg You could just add this to your stylesheet:

    div .y
    {
    background-image:url("yyy.jpg")
    }

    and in your body where you want the yyy div to appear, just do what sunfire said: <div class="y">blah</div>
  6. #4
  7. No Profile Picture
    Moderator =(8^(|)
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Feb 2002
    Location
    Sacramento, CA
    Posts
    1,710
    Rep Power
    14
    You have lots of options. You can combine elements, such as:
    Code:
    body div div p b { color: red; }
    which will make the text red in any bold section that's inside a paragraph that's inside a div that's inside a div that's inside a body.

    Or, you can use class attributes, so with elements like:
    Code:
    <div>green</div>
    <div class="colorme">blue</div>
    <p class="colorme">red</p>
    you could color them with:
    Code:
    div { color: green; }
    .colorme { color: blue; }
    p.colorme { color: red; }
    You can combine both, with something like:
    Code:
    div.navbar ul li.navitem a { color: black; }
    which will select any anchors (links) in a list item with class navitem in a unorder list in a div with class navbar.

    Lastly, there are ids, which are unique, meaning that there can only be one element with each id (versus classes, where many elements can have the same class).
    Code:
    <div id="floater">float</div>
    
    #floater { float: left; }
    Don't try to combine ids with the other techniques (id: div p.red #item), since ids are unique and idependent of heirarchy.
    -james
  8. #5
  9. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    5
    Rep Power
    0
    thanks all... very helpful!

IMN logo majestic logo threadwatch logo seochat tools logo