Bootstrap

Etre en mesure de concevoir des sites web responsive au design innovant avec le framework Bootstrap.

Introduction et prise en main

• Présentation : concept, versions et historique
• Qu'est-ce qu'un framework CSS ?
• Ressources
• Les plug-ins et autres extensions
• Télécharger et intégrer Bootstrap

Le système de grille

• Mise en page statique, fluide, adaptative
• Le principe
• Utiliser plusieurs grilles dans une page
• Imbriquer des grilles
• Modifier l'ordre des colonnes
• Atelier: création de gabarits de mise en page

Les éléments de base (CSS)

• Présentation
• La typographie
• L'insertion de code
• Les tableaux
• Les images
• Les outils CSS
• Atelier: création d'une page article

Les composants réutilisables

• Les icônes
• Les boutons
• Les formulaires
• La navigation
• Le fil d'Ariane
• La pagination
• Les badges
• Les vignettes et les médias
• Les listes
• Les panneaux
• Les barres de progression
• Atelier: création d'une fiche produit

Les extensions Javascripts

• Présentation : API Bootstrap
• Les transitions
• Les boîtes de dialogue (modales)
• Menus déroulants
• Scrollspy
• Les onglets
• Les infobulles (tooltip et popover)
• Alertes et messages d'information
• Afficher / Masquer des éléments : accordéon
• Carrousel
• Le système de navigation secondaire « Affix »
• Atelier: création d'une page d'accueil

Personnaliser Bootstrap avec LESS

• Qu'est-ce qu';un préprocesseur ?
• Variables et mixins
• Règles imbriquées
• Composants et approche modulaire
• Atelier: Mise en place d'un mini site complet