Concevoir le gabarit d'un site Web avec une grille CSS
Adresses derrière les liens

Illustrer une grille
Écran 4
  1. 960.gs Variable Grid System http://www.spry-soft.com/grids/
Quelques lectures
Écran 6
  1. Frameworks CSS : Blueprint vs 960 GS http://css4design.com/frameworks-css-blueprint-vs-960-grid-system
  2. Grille modulaire pour périphériques mobiles http://css4design.com/grille-modulaire-peripheriques-mobiles-iphone-android-ipad
  3. Calculer une grille de mise en page typo avec le nombre d'or http://css4design.com/grille-typographique-nombre-d-or
  4. The 960 Grid System Made Easy http://sixrevisions.com/web_design/the-960-grid-system-made-easy/
  5. Prendre en main un Framework CSS. #1 960 Grid System http://www.lafermeduweb.net/billet/tutorial-prendre-en-main-un-framework-css-1-960-grid-system-214.html
  6. Prendre en main un Framework CSS. #2 Blueprint http://www.lafermeduweb.net/billet/tutorial-prendre-en-main-un-framework-css-2-blueprint-217.html
  7. Grid-based Design Gallery http://grid-based.com/
Systèmes disponibles
Écran 10
  1. Blueprint CSS Framework http://blueprintcss.org/
  2. 960 Grid System http://960.gs/
  3. The Golden Grid http://code.google.com/p/the-golden-grid/
  4. YUI Grids https://developer.yahoo.com/yui/grids/
  5. Choisir un framework CSS http://css4design.com/choisir-un-frameworks-css
Présentation de la grille Blueprint
Écran 12
  1. Construct your CSS http://www.constructyourcss.com/
  2. Site de BluePrint http://blueprintcss.org/
Résultat de la grille Blueprint sans la classe last
Écran 19
  1. Construct your CSS http://www.spry-soft.com/grids/
  2. Construct your CSS http://www.constructyourcss.com/
Résultat de la grille Blueprint avec la classe last
Écran 21
  1. Construct your CSS http://www.spry-soft.com/grids/
  2. Construct your CSS http://www.constructyourcss.com/
Vider les marges avec clear ou clearfix (2/2)
Écran 23
  1. Rétablir le flux après des éléments flottants en CSS sans balise HTML supplémentaire http://css4design.com/retablir-le-flux-apres-des-elements-flottants-en-css-sans-balise-html-supplementaire
Autres classes qui peuvent être utiles
Écran 28
  1. 10 things I learned about Blueprint CSS http://spin.atomicobject.com/2011/01/04/10-things-i-learned-about-blueprint/
Présentation de 960 Grid System (ou 960.gs)
Écran 31
  1. fichiers PDF pour dessiner les maquettes https://github.com/nathansmith/960-Grid-System/tree/master/sketch_sheets/
  2. modèles de page https://github.com/nathansmith/960-Grid-System/tree/master/templates/
  3. 960.gs Variable Grid System http://www.spry-soft.com/grids/
  4. 960 Grid System http://960.gs/
Pour conclure sur les systèmes de grilles
Écran 43
  1. CSS Framework Frustration http://spin.atomicobject.com/2009/04/20/css-framework-frustration/
Tous droits réservés 2013, Espace Courbe Formation inc. —28 septembre 2013 — 15:23:20