CSS in Drupal 7

I have always been impressed with Drupal's ability to handle and aggregate CSS/javascript files "out-of-the-box."  After all, I can just add those files to the .info file and my theme and be up-and-running in seconds.  The solution is easy and the aggregation simple when going live.  However, as the sites I've been developing have scaled, I have found myself wanting more.  Thankfully, Drupal 7 comes through with a few different but still easy ways of handling CSS that I'm very excited about.  Here's the breakdown:

.info file

Usage: Add your new CSS file to your theme and put a reference to it in the .info file using this syntax: stylesheets[all][] = YOUR_STYLESHEET.css.  'All' in this statement can be replaced by the relevant media property (media, print, etc.)

Advantage: Ease of use, CSS pulled in on every page in your theme and automatically aggregated

Disadvantage: CSS pulled in on every page in your theme, little control.

drupal_add_css()

Usage: Add the file to your theme as well as code to your template.php that looks something like this:

<?php
function YOURTHEME_preprocess_html(&$vars) {
   drupal_add_css(path_to_theme() . '/YOURFILE', array('weight' => CSS_THEME, browsers => array(BROWSER_SPECIFICS), 'preprocess' => FALSE));
}

Advantage: You can control a whole host of options, including what browsers to send the stylesheets to (ahem, IE), whether the file is external to the site or not (new in 7), the group in which it should be placed (CSS_SYSTEM - loaded first, CSS_DEFAULT - loaded next, CSS_THEME - loaded last), the weight within that group, the media property, whether it should be aggregated and more.  Will only be loaded where you define it to be. See drupal_add_css documentation for more.

Disadvantage: Trickier than .info file method.

hook_css_alter()

Usage: Add some variant of the following code to template.php in your theme:

<?php
function YOURTHEME_css_alter(&$css) {
  // code for altering CSS files before output on the page
}

Advantage: This powerful function allows you to add, remove, and reorder stylesheets added anywhere in Drupal before a page load.  This means you can remove stylesheets added by modules or even core based on your needs. See hook_css_alter documentation for examples on how to do that.

Disadvantage: More advanced technique for people who are more comfortable with front-end languages (HTML, CSS, JS).

Hopefully, you can see in these very quick and dirty examples how powerful these 3 methods are in controlling CSS output in the theme layer based on your needs.  Although I think it is good to get accustomed to using drupal_add_css, I will note I have also used and like the Conditional Stylesheets module for adding conditional stylesheets to your .info file (if that is all you need).

If you are looking for resources on these methods outside of the Drupal API links above, I highly recommend the Advanced Theming chapter in The Definitive Guide to Drupal 7 (I recommend that book in general).