Manipuler et Personnaliser des Tableaux avec Bootstrap

Styliser vos tableaux
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre Bootstrap - Le Framework Front-End
Revoir le teaser Je m'abonne
2,5
Transcription

Cette leçon fait partie de la formation
49,90€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis
2,5
Cette leçon fait partie de la formation
49,90€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Les objectifs de cette vidéo sont de vous apprendre à :
- Ajouter et structurer des tableaux avec Bootstrap.
- Appliquer des styles et des classes de Bootstrap pour personnaliser l'affichage des tableaux.
- Assurer la responsivité des tableaux pour différents appareils.

Apprenez à créer et personnaliser des tableaux avec Bootstrap, y compris l'ajout de bordures, de surbrillance et la responsivité.

Dans cette leçon, nous explorerons comment utiliser Bootstrap pour créer et personnaliser des tableaux. Nous commencerons par ajouter un tableau et définir des colonnes pour les noms, prénoms, adresses mail et codes postaux. Ensuite, nous verrons comment styliser ces tableaux en utilisant les classes fournies par Bootstrap, comme table-bordered pour ajouter des bordures et table-hover pour des effets de surbrillance au survol.

Nous examinerons également comment mettre en avant certaines parties du tableau, soit une ligne entière ou une cellule spécifique, en appliquant différentes classes de couleur comme success, danger, warning, et info. Enfin, nous traiterons de la responsivité des tableaux, crucial pour un affichage adapté sur des périphériques de différentes tailles. Nous apprendrons comment utiliser la classe table-responsive pour intégrer des barres de défilement horizontales lorsque le tableau ne peut pas être totalement affiché dans un conteneur restreint.

Grâce à cette leçon complète, vous serez capable de manipuler vos tableaux de manière intuitive et de les adapter facilement à divers besoins esthétiques et fonctionnels.

Voir plus
Questions réponses
Comment ajouter une bordure à toutes les colonnes d'un tableau Bootstrap ?
Pour ajouter une bordure à toutes les colonnes d'un tableau, utilisez la classe 'table-bordered' sur l'élément 'table'.
Quelle classe Bootstrap utiliser pour mettre en surbrillance une ligne de tableau ?
Utilisez les classes comme 'success', 'warning', 'danger', ou 'info' pour mettre en surbrillance une ligne spécifique dans un tableau.
Comment rendre un tableau Bootstrap responsive ?
Pour rendre un tableau Bootstrap responsive, enveloppez l'élément 'table' dans une div avec la classe 'table-responsive'.
2 commentaires
2,5
2 votes
5
4
3
2
1
ideal.micro40
Il y a 1 semaine
video sur Bootstrap 3 alors qu'on est sur la version 5.3.6.
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.
Stephd
Il y a 4 ans
tres bonne formation c est une bonne decouverte generale.