Formation pratique CSS - Quelques Liens
Etienne Lemay (@EtienneLem) d'Heliom a fait la présentation, hier soir, lors de l'atelier "Cascading Style Sheets Night Fever", d'un nombre de techniques et d'outils. Nous en avons noté quelques-uns, les voici!
- Utilisation de snippets (par exemple, la base de la page HTML)
http://manual.macromates.com/en/snippets
http://learnboost.github.com/stylus/- Extension (mixins) nib à Stylus
http://visionmedia.github.com/nib/- Package stylus-utils d'Heliom
https://github.com/heliom/stylus-utils- Propriété CSS box-sizing
http://css-tricks.com/box-sizing/
et démo: http://css-tricks.com/examples/BoxSizing/- Package "Zen Coding"
http://code.google.com/p/zen-coding/- Package "mCSS" ("lstn" pour "list-style-type: none" !)
http://minimaldesign.net/downloads/tools/textmate-css-bundle- Commande "Trim" de Photoshop
http://www.creativetechs.com/iq/dont_crop_use_photoshops_trim_feature.html
(voir GIF animé dans la page qui démontre la commande:
)- Démonstration des "list-style-type" disponibles -- vous voulez
probablement le "none" :-)
http://www.w3schools.com/cssref/playit.asp?filename=playcss_ol_list-style-type- LiveReload pour sauvegarder et voir instantanément le résultat
http://livereload.com/- xScope pour mesurer, aligner, etc.
http://xscopeapp.com/- Référence pour la compatibilité de propriétés CSS
http://caniuse.com/- Autres points:
-- Utilisation de font-size relatifs (built-in aux mixins du package
stylus-utils d'Heliom)
-- .clearfix (devrait être bientôt intégré à stylus-utils?) :-)
-- Utilisations de tags html5: nav, header, footer, aside, etc. voir
http://stackoverflow.com/questions/4781077/html5-best-practices-section-header-aside-article-tags










