CSS for Bringing Up Images Last

[Rex100]

I was reading, "Use CSS Images instead of IMG tag: An easy way to speed up the rendering of an image is to simply call as a background of a div tag.", and elsewhere that if you use CSS for images the images will come up last (after your text), which is what I want.

But I don't want to load up my css page with a long list of images (40), becuase the CSS page is loaded into the visitor's browser, and so will slow the length of time it takes to bring up my site. I really don't want to use sprites. Isn't there a way where I can load the images into a PHP includes file and refer to the includes file in the CSS, but what code would I use in the main coding (HTML) from page to page to to bring up the different images for different pages?

Thanks for the help,

Rex

 

[CrazeD]

For static images, such as those used with template files, use CSS. For dynamic images, such as those that change from page to page, use HTML.

If you really want to create a CSS file for each page, which is rather stupid, you can do it pretty easily with PHP. Just make a folder called CSS. Then for each page, make a CSS file. Like, home.css, contact.css...etc. Then dynamically call the CSS file with PHP depending on the page. For simplicities sake, I'll just show you a snippet of code that uses GET for the page.

<?php

$page = $_GET['page'];

echo '<link rel="stylesheet" type="text/css" href="css/'.$page.'.css" />';

?>