
-Maîtriser Bootstrap
-Savoir adapter le code source de Bootstrap
-Savoir intégrer votre propre design grâce Bootstrap
-Développer des sites Web responsive
-Définition d’un framework CSS
– Rappels sur HTML5 / CSS3
– Les alternatives à bootstrap
– Pourquoi utiliser bootstrap ?
– Introduire Bootstrap dans son projet
Travaux pratiques
Installation de Bootstrap. Habiller une page HTML avec Bootstrap
– Principe de structuration et d’intégration
– Faire une mise en page responsive
– Du pixel au root em (rem)
– Mise en place de la grille
– Container, Row, Columns
– Utiliser Flexbox avec la grille Bootstrap
Travaux pratiques
Créer une page web responsive basée sur une grille.
-Titres, et mise en pages du texte
– Les Images responsives
– Tableaux et liste d’éléments
– Navs et Navbars pour la navigation
– Breadcrumb ou fil d’Ariane
– Medias objects
– Cards
– Les listes
– Boutons, groupes de boutons et boutons déroulants
– Pagination
– Formulaires et Inputs
– Les alertes
– Un peu de déco : les badges, les spinners
– Jumbotron
– Lecteurs vidéos et audios personnalisés
Travaux pratiques
Intégration du CSS personnalisé dans votre projet
-Carrousels de photos, accordéons
– Collapse elements
– Modals ou Boîtes modales
– Popovers
– Progress ou Barre de progression
– Scrollspy
– Toasts
– Tooltips
– Menus déroulants
– Tabulation
Travaux pratiques
Utilisation de JavaScript et jQuery
– Analyser des modèles construits à partir de Bootstrap.
– Créer un site avec un des modèles.
– Créer une page à partir d’un modèle en surchargeant le fichier CSS.
– Utiliser des fichiers SAAS avec un préprocesseur et/ou un serveur NodeJS.
Référence : WEB029
Type de Stage : Pratique
Durée : 2 jours
Développeurs Web,
Webdesigners et Webmasters
Connaissances de base en HTML
et CSS.