css background

Hi Experts,

I like the style of background in this page example, can someone explain how this is done?  Is it one big image or is there a CSS trick to get this effect.

http://demo.joomla.org/

Thanks,

HNM
HelpNearMeAsked:
Who is Participating?
 
remixedcatCommented:
well I do see CSS drop shadows.... on some elements and the rest is done like this:
http://demo.joomla.org/templates/joomla/images/body-bg.png

which has the back glow
0
 
remixedcatCommented:
the rest is done with centering code and a blue solid color background:

most use this:


background-position: top center;
background-repeat: no-repeat;

Open in new window

0
 
remixedcatCommented:
or this:


background:#000000 url('background.jpg') no-repeat center top;

Open in new window

0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
HelpNearMeAuthor Commented:
wow and that background image is 216KB, seems to go against the file size fear mongering when it comes to page load time and SEO.  Is this a typical practice to use such a large background image (216KB)?

Thanks,

HNM
0
 
remixedcatCommented:
I recommend under 150KB
0
 
Alicia St RoseOwner & Principle Developer/DesignerCommented:
Hi HelpNearMe,
It's not a typical practice to use large images. But I have noticed it's becoming more prevalent as design is weighing in as much as backend and functionality. The Wow factor is big. Also, faster modems and wireless are making it less of an issue. It seems that the decline of the physical the Magazine and Catalog is spurring this evolution.
I myself have been guilty of this. At some point you've go to weigh the load time vs audience. If the audience is tech savvy, they probably can handle a large image file download on a website.

Please don't give me any points for this. I'm just puttin' in my 2¢.
0
 
HelpNearMeAuthor Commented:
Great info, thanks to both of you.  this is just what I need to brighten up an otherwise boring corporate site.

HNM
0
 
remixedcatCommented:
your most welcome ;-)
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.