CSS
Out of Date
The following content is likely out-of-date. It concerns a legacy technology and/or is no longer maintained-- likely a decade old. Please see you favorite search engine for the latest information.
Here are some interesting examples of CSS. I have put them in a logical order, if you are learning from a blank slate.
(Color coding: Beginner Intermediate Advanced)
Beginner
- This site has an introduction to CSS (for those who are completely new to the topic) as well as details of the new features of CSS3.
- W3 Schools: Good tutorial on CSS basics. (Their other tutorials are better, but this covers all the basic concepts.)
- WestCiv.com's Learn CSS and Web Standards page is also a good starting point.
Intermediate
Advanced
- CSS Playground: one man's interesting experiements
-
CSS Zen Garden: a great demonstration of the power of
CSS.
Here is a very cool counter-example: Bruce Lawson's "Geocities 1996" page - http://css.maxdesign.com.au/listamatic/index.htm: a great demonstration of the power of CSS.
- Mark Schenk has a good selection of ambitious stuff.
- Rounded corners: some mostly unsuccessful techniques
For doing page layout, these resources are recommended:
- The Zen of CSS Design has the simplest and clearest examples of how to do this.
- http://www.tanfa.co.uk/css/layouts/
- H / DCD / F layout (in Italian)
- CSS Creator: generates a layout based on your specific needs. I was not so successful with this site.
Interesting approach to encapsulating all the IE-specific hacks together in a nice package is here.
Undoing HTML is another useful concept, as captured in this file. Although the concept of consistency across web sites is important, it's pretty much been sent to Siberia by the graphic people. Most designers want to start with a clean canvas. I have come around to this thinking.
- Original Posting by tantek
- Nit picking by Eric Meyer