The new features of CSS 3 uncover a lot of new possibilities and are beginning to be more widely used. Don’t get too excited though because it is not fully supported by all browsers. But this doesn’t mean you shouldn’t use it at all…
Because these new features are not supported by some browsers (*cough* IE *cough*) you shouldn’t rely on CSS 3 for layout purposes. Instead you should use these new techniques to enhance your design for those viewers using the compatible browsers.<
Below are descriptions of some of the most basic new features:
Text shadow does exactly what it sounds like. It adds a shadow to your text.
Border Radius allows you to add rounded corners to an object. You can also specify a different size for each corner.
Box shadow is similar to Text shadow except it’s added to an object and not text.
Again, those are just the most basic of features. There are a lot of other techniques and tutorials out there but I would use all of these sparingly, since Internet Explorer doesn’t support any CSS 3 at the moment. That being said there are people out there who are able to achieve some awesome effects using CSS 3. For information on more advanced techniques check out some of the following tutorials and examples:
CSS 3 Resources
- Start Using CSS 3 Today: Techniques and Tutorials
- CSS 2.1 & CSS 3 Cheat Sheet (PDF)
- Create a Beautiful Custom Dialog Box with jQuery & CSS3
- Star Wars: A New Hope in HTML & CSS
- Super Awesome Buttons with CSS3 & RGBa
- 11 Classic CSS Techniques made Simple with CSS 3