Microsoft Tech Days

Slides for this presentation are now available on Slideshare . The example files used in these slides can be downloaded here . Please note these examples are essentially rough and ready demos. The jQuery examples are very basic – in the real world you would want to wrap this stuff in conditional comments or test for support etc. They just serve to show how this stuff works at the most simple level and will save you typing the stuff out from the slides.

Resources

• When Can I Use: compatibility tables for features in HTML5, CSS3, SVG and other upcoming web technologies
• css3.info
• Lots of useful stuff at dev.opera.com
• jQuery look: Tim Van Damme – recreating CSS3 effects in non-supporting browsers using jQuery

Selectors

• Selectors module
• 24 Ways: Cleaner Code with CSS3 Selectors
• Sitepoint CSS Reference: nth-child

Fonts

• Fonts module
• A List Apart: Web Fonts at the Crossing
• 24 Ways: Designing for the Switch
• Typekit
• Fontdeck
• fonts.com webfonts

Color

• Color module
• 24 Ways: Working with RGBA Color

Background and Borders

• Background and Borders module
• Snook.ca: Multiple backgrounds and CSS Gradients
• Opera Developer Community: Beautiful UI Styling with CSS3

Media Queries

• Media Queries
• A List Apart: Responsive Web Design
• Dealing with Windows Phone 7 until it is updated to use IE9
• Responsive Web Design: what it is and how to use it
• Media Queries – inspiration site

CSS3 Polyfills

• Selectivizr
• Modernizr
• eCSStender
• css3pie
• css3-mediaqueries.js
• Respond