I've heard that some websites use CSS as their background image, thus speeding up loading times. How do I do this? Thanks!

4 answers

1
point

I wrote an article bout it a while ago ... and I guess that's exactly what you're lookin for.

:)

Answered about 9 years ago by biophonc
  • Nice charts. I only considered sprites as an afterthought because of how the question was presented. I assumed he meant the background image of the whole page... in which case, sprites do him no good at all. However, if he is talking about roll-over images or background images to smaller parts of the page, sprites would be a big help. It all depends on what he means. Abinadi Ayerdis about 9 years ago
0
points

I don't think that CSS will make loading time any faster. However, there are definite benefits to using CSS. Check out this for CSS and backgrounds, and you might want to also learn CSS for all of its benefits here.

It also occurs to me that you might be thinking of CSS sprites. They can improve loading times. Check that out here.

Answered about 9 years ago by Abinadi Ayerdis
  • Hey guys....thanks a lot for helping out. Sure, I'll read up on those, actually I'm on the w3schools HTML certification program already, but thanks alot guys. You guys rock. I'm not super yet on HTML, but you should my site in the works, millenniumbug.tumblr.com . That's an Inkscape render as the background, and takes about 137kb of size. Yea, CSS sprites, well, I know about those, they speed up load times and stuff. Abinadi, that's what I was asking about- background for the whole image, yeah. Thanks man! Alexander WInifred about 9 years ago
espais 0
0
points

If I understand the question correctly (and you may be thinking of what Abinadi had posted regarding speed...), then the following code snippet should help:

<style type="text/css">
  body {
    background: url('<path to your image>') <repeat_options>
  }
</style>

So for a real example then...

<style type="text/css">
  body {
    background: url('images/bg.png') no-repeat top left;
  }
</style>
Answered about 9 years ago by espais
0
points

Hey guys....thanks a lot for helping out. Sure, I'll read up on those, actually I'm on the w3schools HTML certification program already, but thanks alot guys. You guys rock. I'm not super yet on HTML, but you should my site in the works, millenniumbug.tumblr.com . That's an Inkscape render as the background, and takes about 137kb of size. Yea, CSS sprites, well, I know about those, they speed up load times and stuff. Abinadi, that's what I was asking about- background for the whole image, yeah. Thanks man!

Answered about 9 years ago by Alexander WInifred