Member Avatar for Makcarov

how to make the background picture as a whole page?... because when i create a background pic from photoshop and adjust to 550 height and 1000 weight(in piexels) it didn't fit to the screen of the monitor.

  • 6 Contributors
  • 6 Replies
  • 89 Views
  • 3 Weeks Discussion Span
  • Latest Post Latest Post by shironui
Member Avatar for shaya4207

In your CSS by the tag that you want the image to be add background: url('your_image.file');width 100%; height: 100% , just keep in mind that the image might get distorted on different screen sizes

Member Avatar for Bestwebdesign

Hi,
Type this command in your CSS

html {
        background: url(images/bg.jpg) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
}
Edited by Bestwebdesign because: mistake
Member Avatar for shaya4207

Hi,
Type this command in your CSS

html {
        background: url(images/bg.jpg) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
}

I'm sorry, but IMHO it's wrong to tell somebody to use CSS3 (especially with hacks) until it's widely supported, which at this point it isn't

Member Avatar for johnsteve.bravo

Simply use the following css

body
{
background-attachment:fixed;
background-image:url('folder-name/image-name.jpg');
background-repeat:no-repeat;
}

Member Avatar for gracyj

You can learn and search for your doubts in w3schools.com . It provides very good edit options where we can try our own programs.

Member Avatar for shironui

Simply use the following css

body
{
background-attachment:fixed;
background-image:url('folder-name/image-name.jpg');
background-repeat:no-repeat;
}

a little simpler to just do

body{
background: image:url(folder/image) fixed no-repeat;
}

less is more.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.