Ajout de fonctionnalités interactives et responsives
Objectifs
Les objectifs de cette vidéo sont :
- Apprendre à créer des listes déroulantes interactives.
- Comprendre le rôle des classes CSS pour le positionnement et le style.
- Rendre les images responsives et adaptées à toutes les tailles d'écran.
Résumé
Découvrez comment ajouter des listes déroulantes et rendre vos images responsives en CSS.
Description
Dans cette leçon, nous explorons divers mécanismes pour transformer notre interface web. Nous commençons par ajouter une liste déroulante à un bouton, en utilisant des classes spécifiques pour indiquer les actions telles que Drop et Toggle. Ensuite, nous voyons comment positionner correctement cette liste sous le bouton grâce à une div avec la classe btnGroup. Pour améliorer l'affichage, nous utilisons des balises li et a.
Ensuite, nous abordons le changement de couleur du texte et de l'arrière-plan avec des classes telles que TextInfo et BG. Une attention particulière est également portée à la gestion des images pour les rendre responsives. Nous expliquons comment utiliser la classe img responsive et explorerons les attributs CSS associés tels que max-width et height-auto.
Enfin, nous parlons de la gestion du contenu pour le rendre adaptable à différentes tailles d'écrans, une compétence essentielle pour le responsive design.
Questions fréquentes
Programme détaillé
Module 1 - Introduction
Module 2 - Explication de la grille
Module 3 - Mettre du style
Module 4 - Utiliser les composants prêt à l’emploi
Module 5 - Utiliser les composants JavaScript
on parle de jquery alors que dans la version il n'y est plus
on nous parle de phpstorm comme editeur qui est payant voir lez bloc note (au secours !!!)
il y a vscode qui maintenant est utiliser par quasi tous les développeurs et qui est gratuit.
sur la video : Maîtriser les Grilles et Colonnes dans Bootstrap
1 - le cours annonce la modification pour passer sur 4 colonne puis de changer les titres,
a ce moment la on reviens en arrière à la modification pour passer en 4 colonnes... et ça recommence
grosse erreur de montage.
2 - ensuite push et pull ont été supprimé pour utiliser le système flexbox sur la version 5
avec les classes order pour gérer l'ordre des colonnes.
3 - l'explication sur le offset n'est absolument pas claire :
on a une première explication, puis une deuxième qui est la même mais avec le résultat directe avec offset.
bref je vais être franc j'ai trouver une formation sur udemy sur bootstrap 5 bien plus intéressante, je ne trouve pas normal d'avoir une formation sur bootstrap 3 qui nous induit en erreur.
ayant passer ce premier chapitre j’arrête car je ne vois aucun intérêt à continuer.