Formation Bootstrap : création de pages Web

1/ Retours sur les fondements des feuilles de style CSS

• Présentation des feuilles de style

• Définition d'un style

• La balise LINK

• La notion de cascade

• Les attributs des styles

• exemples de feuilles de style

2/ Les technologies Front End et le rôle de Bootstrap

• Fonctionnement client serveur

• Que sont HTML et CSS

• Bootstrap, Foundation et les autres frameworks web

• Pourquoi utiliser Bootstrap ?

• Limites du framework

• Bootstrap et JS

• Responsive Web Design et Bootstrap

• Les évolution de Bootstrap, de la v1 à la V4

3/ Mise en place de Bootstrap

• Télécharger Bootstrap

• La documentation

• Quelques exemples tout prêts

4/ La structure du framework Bootstrap

• Présentation du framework et de son utilisation

• La structure des fichiers

• Le template HTML basique

• Les styles globaux

• Les grilles par défaut

• Les grilles fluides

5/ Bootstrap et le CSS

• Mise en forme du texte

• Mise en forme des tableaux

• Mise en forme des boutons

• Mise en forme des formulaires

• Mise en forme des images

• Mise en page globale (liaisons à Bootstrap et aux librairies, flottements, masquage d’éléments)

6/ Les composants de mise en page Bootstrap

• Menu déroulant

• Groupes de boutons

• Boutons déroulants

• Eléments de navigation

• La navbar

• Le fil d’Ariane

• La pagination

• Les labels et les badges

• Les éléments de typographie

• Les miniatures

• Les alertes et les barres de progression

• Les objets média

7/ Utilisation des plugins JavaScript

• Présentation et vue d’ensemble

• Les transitions

• Les fenêtres modales

• Les menus déroulants

• Les scrollspy

• Les infobulles

• Les accordéons

• Les carrousels d’images

• Les alertes

• Les popovers

• Les effondrements

• La fonction Affix

• Le champ TypeAhead

8/ Bootstrap en pratique

• Personnaliser Bootstrap

• Construire un site avec Bootstrap

• WordPress et Bootstrap

• Joomla ! et Bootstrap

9/ Bootstrap : Le framework CSS du web responsive

• Présentation du framework mobile first

• Concept de grille

• Créer une grille qui s'adapte à la taille de l'écran

• Afficher et cacher des blocs en fonction de la taille de l'écran

• Manipuler les Media Queries

• Créer des menus et adapter les images

• Créer une interface responsive