Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

CSS3: The Future is Now at Drupal Design Camp Boston

2 198 vues

Publié le

The next generation of CSS is here, and it's being used on thousands of sites. Come learn about the new styles, and how to use them today. Rounded corners, gradients, translucent color, shadows — forget making images, do it with CSS.

I cover the state of cross-browser support and tips for implementing graceful fallbacks. I talk about the future and where CSS3 is going. And I provide resources on where to learn more.

Publié dans : Technologie
  • DOWNLOAD THE BOOK INTO AVAILABLE FORMAT (New Update) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://urlzs.com/UABbn } ......................................................................................................................... Download Full EPUB Ebook here { https://urlzs.com/UABbn } ......................................................................................................................... Download Full doc Ebook here { https://urlzs.com/UABbn } ......................................................................................................................... Download PDF EBOOK here { https://urlzs.com/UABbn } ......................................................................................................................... Download EPUB Ebook here { https://urlzs.com/UABbn } ......................................................................................................................... Download doc Ebook here { https://urlzs.com/UABbn } ......................................................................................................................... ......................................................................................................................... ................................................................................................................................... eBook is an electronic version of a traditional print book THE can be read by using a personal computer or by using an eBook reader. (An eBook reader can be a software application for use on a computer such as Microsoft's free Reader application, or a book-sized computer THE is used solely as a reading device such as Nuvomedia's Rocket eBook.) Users can purchase an eBook on diskette or CD, but the most popular method of getting an eBook is to purchase a downloadable file of the eBook (or other reading material) from a Web site (such as Barnes and Noble) to be read from the user's computer or reading device. Generally, an eBook can be downloaded in five minutes or less ......................................................................................................................... .............. Browse by Genre Available eBOOK .............................................................................................................................. Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, CookBOOK, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, EBOOK, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, ......................................................................................................................... ......................................................................................................................... .....BEST SELLER FOR EBOOK RECOMMEND............................................................. ......................................................................................................................... Blowout: Corrupted Democracy, Rogue State Russia, and the Richest, Most Destructive Industry on Earth,-- The Ride of a Lifetime: Lessons Learned from 15 Years as CEO of the Walt Disney Company,-- Call Sign Chaos: Learning to Lead,-- StrengthsFinder 2.0,-- Stillness Is the Key,-- She Said: Breaking the Sexual Harassment Story THE Helped Ignite a Movement,-- Atomic Habits: An Easy & Proven Way to Build Good Habits & Break Bad Ones,-- Everything Is Figureoutable,-- What It Takes: Lessons in the Pursuit of Excellence,-- Rich Dad Poor Dad: What the Rich Teach Their Kids About Money THE the Poor and Middle Class Do Not!,-- The Total Money Makeover: Classic Edition: A Proven Plan for Financial Fitness,-- Shut Up and Listen!: Hard Business Truths THE Will Help You Succeed, ......................................................................................................................... .........................................................................................................................
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • You can watch the presentation of these slides at: http://techtv.mit.edu/videos/7759-css3-the-future-is-now-jen-simmons
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • CSS3 Please
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici

CSS3: The Future is Now at Drupal Design Camp Boston

  1. 1. CSS3:Now The Future is drupal Design camp boston June 2010 http://extras.jensimmons.com/ designcamp2010/css3.pdf Sunday, June 20, 2010
  2. 2. Jen Simmons Lullabot Trainer Lead Front-End Developer and architect at workhabit twitter: jensimmons irc/d.o: jensimmons http://extras.jensimmons.com/drupalconsf2010/css3.pdf Sunday, June 20, 2010
  3. 3. wouldn’t you like to make rounded corners layout your content in multiple columns put multiple background images on one thing use translucent colors make drop shadows create gradients and reflections put shadows on text use more fonts on the web have image-based borders on boxes animate stuff Sunday, June 20, 2010
  4. 4. You can! with just css today Sunday, June 20, 2010
  5. 5. but what about the evil one? Sunday, June 20, 2010
  6. 6. Sunday, June 20, 2010 ie
  7. 7. well, you can ignore internet explorer let it stay in 200X Sunday, June 20, 2010
  8. 8. do websites need to look exactly the same in every browser? http:// dowebsitesneedtolookexactlythesameineverybrowser. com Sunday, June 20, 2010
  9. 9. Sunday, June 20, 2010
  10. 10. Sunday, June 20, 2010
  11. 11. “progressive enhancement” Sunday, June 20, 2010
  12. 12. compliant internet browser* explorer drop shadow none rounded corners square corners gradient solid color translucency opaqueness new font old font * safari & chrome, firefox, opera Sunday, June 20, 2010
  13. 13. workaround ie with filter hacks filter: progid:DXImageTransform.Microsoft.gradient (startColorStr='#444444', EndColorStr='#999999'); / * IE6,IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.gradient (startColorStr='#444444', EndColorStr='#999999')"; /* IE8 */ http://css3please.com Sunday, June 20, 2010
  14. 14. http://modernizr.com Sunday, June 20, 2010
  15. 15. http://code.google.com/chrome/chromeframe Sunday, June 20, 2010
  16. 16. enough about ie what about everybody else? safari chrome opera firefox Sunday, June 20, 2010
  17. 17. browser makers are implementing stuff that not everyone has agreed to. and it’s ok. Sunday, June 20, 2010
  18. 18. { -moz-border-radius: 12px; /* FF1+ */ -webkit-border-radius: 12px; /* Saf3+, Chrome */ border-radius: 12px; /* Opera 10.5, IE 9 */ } Sunday, June 20, 2010
  19. 19. div.block { -moz-border-radius: 12px; -webkit-border-radius: 12px; -khtml-border-radius: 12px; border-radius: 12px; } Sunday, June 20, 2010
  20. 20. browser makers are implementing stuff in bits and pieces over time. and it’s ok. Sunday, June 20, 2010
  21. 21. the Css working group (where css is born) is creating the spec over time in “modules” Sunday, June 20, 2010
  22. 22. http://www.w3.org/Style/ CSS/current-work Sunday, June 20, 2010
  23. 23. let’s get to it Sunday, June 20, 2010
  24. 24. Border-radius http://border-radius.com Sunday, June 20, 2010
  25. 25. box-shadow http://westciv.com/tools/boxshadows Sunday, June 20, 2010
  26. 26. text-shadow http://css3generator.com Sunday, June 20, 2010
  27. 27. http://lab.simurai.com/css/iloveblur Sunday, June 20, 2010
  28. 28. http://desandro.com/articles/the-new-lens-flare Sunday, June 20, 2010
  29. 29. multicolumn layout http://css3generator.com Sunday, June 20, 2010
  30. 30. gradients http://gradients.glrzad.com http://westciv.com/tools/gradients http://westciv.com/tools/radialgradients Sunday, June 20, 2010
  31. 31. rgba and hsla http://css3generator.com Sunday, June 20, 2010
  32. 32. transformations http://westciv.com/tools/transforms Sunday, June 20, 2010
  33. 33. CSS animations one cool example: http://anthonycalzadilla.com/css3-ATAT (only works in webkit) -webkit-transform: translate(x,y) rotate(x) Sunday, June 20, 2010
  34. 34. font-face http://fontsquirrel.com http://typekit.com Sunday, June 20, 2010
  35. 35. http://typefolly.com http://drupal.org/project/google_fonts Sunday, June 20, 2010
  36. 36. resources Sunday, June 20, 2010
  37. 37. tools http://css3generator.com http://border-radius.com http://westciv.com/tools http://gradients.glrzad.com Sunday, June 20, 2010
  38. 38. Dan cederholm Handcrafted css Sunday, June 20, 2010
  39. 39. andy clarke hardboiled web design Sunday, June 20, 2010
  40. 40. http://www.w3.org/Style/ CSS/current-work Sunday, June 20, 2010
  41. 41. http://css3.info Sunday, June 20, 2010
  42. 42. http://google.com Sunday, June 20, 2010
  43. 43. have fun :) welcome to the future http://extras.jensimmons.com/ designcamp2010/css3.pdf find me on twitter, irc, drupal.org, and irl: jensimmons Sunday, June 20, 2010

×