CSS3 + Progressive Enhancement

873 views

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
873
On SlideShare
0
From Embeds
0
Number of Embeds
16
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide


















  • CSS3 + Progressive Enhancement

    1. 1. CSS3 + Progressive Enhancement Takeru Suzuki Feburuary 20, 2010
    2. 2. CSS1 Cascading Style Sheets, Level 1 ✓ 1996-12-17 ✓ 1999-01-11 ✓
    3. 3. CSS2 Cascading Style Sheets, Level 2 ✓ 1998-05-12 ✓ 2008-04-11 ✓
    4. 4. CSS 2.1 Cascading Style Sheets Level 2 Revision 1 ✓ 2009-09-08 ✓
    5. 5. CSS3 Cascading Style Sheets Level 3 ✓ ✓
    6. 6. W3C Recommendation ✓ : ✓ :
    7. 7. CSS Snapshot CSS: ✓ CSS 2.1 ✓ CSS Namespaces ✓ Selectors Level 3 ✓ CSS Color Level 3
    8. 8. @font-face ✓ ✓
    9. 9. @font-face @font-face { font-family: "League Gothic"; src: url("/fonts/League_Gothic.eot"); src: local("League Gothic Regular"), local("LeagueGothic"), url("/fonts/League_Gothic.otf") format("opentype"); } ... h1, .nav { font-family: "League Gothic", sans-serif; }
    10. 10. Pseudo-classes :not() :only-child :nth-child(n) :nth-last-of-type(n)... ✓ IE
    11. 11. Pseudo-classes <!--[if lte IE 8]> <script type=”text/javascript” src=”/js/DOMAssistant.js”></script> <script type=”text/javascript” src=”/js/ie-css3.js”></script> <![end if]-->
    12. 12. ✓ ? ✓ IE ? !
    13. 13. Graceful Degradation ✓ ✓
    14. 14. Progressive Enhancement ✓ ✓
    15. 15. Back to Basics ✓ ? ✓ ✓
    16. 16. Thank You! http://terkel.jp/

    ×