42 users online (1 members and 41 guests)  


  Results 1 to 11 of 11

Related

  1. Ecover graphic needed + long term graphic artist    Forum: Internet Services
    Replies: 0
  2. quest(ion)    Forum: Javascript Forum
    Replies: 6
  3. Graphic placement    Forum: HTML Forum
    Replies: 6
  4. Content next to graphic    Forum: HTML Forum
    Replies: 2
  5. Replies: 4
  1. #1
    kjones's Avatar
    New User

    Status
    Offline
    Join Date
    May 2002
    Posts
    5

    background graphic quest.

    How do I use a graphic for a background but not have it repeat/tile itself on the page? I just want the one image to fill the whole page and not tile

  2. #2
    Derek's Avatar
    Be Yourself

    Status
    Offline
    Join Date
    Aug 2001
    Location
    St. George, Utah, USA
    Posts
    466
    using css you could make it not tile but if you want it to fill up the whole background of the page I think you have to make it that size

  3. #3
    Nutrocker's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2002
    Location
    Manchester
    Posts
    8
    And the CSS is something like.....

    Code:
    <style>
    body {
    background-color: #ffffff;
    background-image: url(http://example.com/yourbg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed  }
    </style>

    The above code goes in the head.

    background-color: #ffffff; this line assigns a color, suggestion - use with an image and pick a color that complements your image and looks good with your page w/o the img in case it doesn't download or some one turn images off. You can use hex codes color names or RGB codes here.

    background-image: url(http://example.com/yourbg.jpg); this like assigns your background image

    background-repeat: no-repeat this line prevents your image from repeating, other possible values here are repeat, repeat-y, and repeat-x

    background-position: center center this line positions your image. Horizontal keywords include (left, center, right)
    Vertical keywords include (top, center, bottom)

    background-attachment: fixed this line prevents scrolling, possible values are fixed and scroll.

  4. #4
    Doorknob's Avatar
    Super Newbie

    Status
    Offline
    Join Date
    Jun 2002
    Location
    Malaysia
    Posts
    316

    RE

    background: fixed (prevents image from scrolling u mean )

  5. #5
    Mr. Blue's Avatar
    Evil twin of Dave

    Status
    Offline
    Join Date
    Jul 2001
    Location
    MA, USA
    Posts
    148
    I don't know why you'd want to go through all that CSS code when all you need is:

    <body background="imageurl" bgproperties="fixed">

    I guess if you want more "Style" you can go with CSS

    -Dave

  6. #6
    Nutrocker's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2002
    Location
    Manchester
    Posts
    8
    bgproperties is MSIE specific, that's one reason to use CSS instead

  7. #7
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    And it will also cause your code to fail HTML4.01 validation.
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  8. #8
    Desbaaz's Avatar
    New User

    Status
    Offline
    Join Date
    Mar 2003
    Location
    a redneck infested backwater town in northern Fl
    Posts
    5
    wow! i'm glad i stumbled across this post. thanks, nutrocker. You've just solved a handfull of problems that i've been stressing out about.

  9. #9
    Doorknob's Avatar
    Super Newbie

    Status
    Offline
    Join Date
    Jun 2002
    Location
    Malaysia
    Posts
    316
    Originally posted by Nutrocker
    bgproperties is MSIE specific, that's one reason to use CSS instead
    oops. didn't know that.

  10. #10
    sonofmidi's Avatar

    Status
    Offline
    Join Date
    Jan 2001
    Location
    NC, USA
    Posts
    75
    The CSS can be abbreviated.

    <style>
    body {
    background: #ffffff url(http://example.com/yourbg.jpg) center no-repeat fixed;
    }
    </style>
    Last edited by sonofmidi; 05-13-2003 at 06:51 AM.

  11. #11
    Drumasta276's Avatar
    New User

    Status
    Offline
    Join Date
    May 2003
    Location
    USA
    Posts
    5
    Yo thanks fellas that cleans my first page up a bit!



Tags for this Thread