How to reduce css http requests?

Question

How to reduce css http requests?

1 large css file

or one css file which importing all other css

is this same?

What is the benefit of using this

@import url('/css/typography.css');
@import url('/css/layout.css');
@import url('/css/color.css');

Answer 1

1 large css file or one css file which importing all other css is this same?

No as the Client still needs to load every CSS file (with one HTTP-request each)

Some Links to learn more about reducing HTTP requests:

• Yahoo Best Practices
• Blog-post about the same topic

If you are using Firefox I highly recommend Firebug, which offers a view with detailed information about HTTP-Requests.
EDIT:
As flybywire points out in the comments: YSlow is a Firefox extension that integrates with Firebug to analyze web page performance

3 easy things I would try first:

• Combine global CSS (the things you use on every page)
• Compress CSS (with YUI compressor or some online tool)
• Inline the page-specific stuff (things that are not shared among pages)

Most of those things also apply to Javascript files.