Drupalcon notes: CSS3: The Future is Now
Find the slides at: http://extras.jensimmons.com/drupalconsf2010/css3.pdf
- What can CSS3 do? Basically, suck less than CSS2. Lots of text and background effects.
- "progressive enhancement" - the idea of a site looking different in different browsers - you write out all the specifications in such a way that browsers that can't support them simply ignore them.
- You can do some awful hacks in IE6 - look at http://css3please.com/ but consider stabbing yourself in the eye first
- http://modernizr.com - ways to push different code to different browsers
- What about everyone else? Safari, Chrome, Opera, Firefox? iPhone? iPad? If it works in Safari, it mostly works in Chrome -- they're both WebKit browsers
-
Browser makers are each implementing things that not everyone has agreed to
-- and this is ok! - example: -moz-border-radius: gives you rounded borders in some browsers, webkit-border-radius: get you others. There's also border-radius: which is the CSS3 version. Right now, do all three to cover the greatest number of browsers. Also as trivia: -khtml-border-radius: for Konqueror
- The CSS Working Group is creating the spec for CSS3 over time in 'modules'
- http://border-radius.com lets you play with border-radius ideas
- http://css3generator.com for working out details visually
- multiple columns, zomg.
- CSS3 gradient generator tool: http://gradients.glrzad.com/
- More gradients: http://westciv.com/
- RGBA = red-green-blue-alpha - play with it at http://css3generator.com
- http://fontsquirrel.com and http://typekit.com
- Dan Cederholm's Handcrafted CSS is apparently a very good book
- http://www.w3.org/styles/css/current-work to see where CSS3 modules stand right now