Table bootstrap Exemple de lignes de survol

Mohamed Benoit
Table bootstrap Exemple de lignes de survol
Un cadre CSS appelé bootstrap aide à créer des sites Web réactifs. Il propose des classes prédéfinies pour ajouter du style aux éléments HTML. Par exemple, pour créer un composant de table, le «tableau"La classe est utilisée. De même, pour créer une table avec l'effet de survol, le «tireur de table"La classe peut être utilisée.

Cet article décrira:

  • Comment faire une table d'amorçage avec des lignes survol?
  • Comment ajouter des couleurs personnalisées aux lignes de table sur le plan de survol en bootstrap?

Comment faire une table d'amorçage avec des lignes survol?

Amorcer "de table bordée" et "tireur de table«Les classes sont utilisées pour créer une table bordée avec un effet de survol. Le "tireur de table«La classe a un style d'effet de volants prédéfini avec le«:flotter«Pseudo-classe et« le «Couleur de l'arrière plan«Propriété ayant la valeur»RGBA (0,0,0,.075)".

Exemple

Implémentons-le via un exemple:

  • Créez une table en utilisant le HTML "" étiqueter. Attribuez-le le «tableau","de table bordée", et "tireur de table" Des classes.
  • Le "”La balise est utilisée pour mentionner l'en-tête de table.
  • Dans l'exemple indiqué ci-dessous, nous faisons le corps de la table en utilisant le «
    • " élément.
  • Le "
    • »Les balises sont utilisées pour créer les lignes de table, le«" étiqueter.
  • Le "TR: Rocher"Est utilisé pour appliquer l'effet de survol au«
    • " élément.

    Sortir

    De cette façon, la table bootstrap avec l'effet de survol est créée.

    Conclusion

    La table bootstrap avec l'effet de survol est créée à l'aide du «tireur de table" classe. Cette classe ajoutera l'effet de survol sur les lignes de table avec le «Couleur de l'arrière plan«Propriété ayant la valeur»RGBA (0,0,0,.075)". Cependant, vous pouvez personnaliser la couleur de survol en utilisant CSS. Ce message a décrit comment ajouter l'effet de survol du tableau bootstrap.

    l'effet de survol du tableau bootstrap.

    Python
    Comment puis-je vérifier si une chaîne est vide en python
    Fonction «Not», fonction «Len ()», fonction «strip ()», opérateur «==», méthode «__eq __ ()», ou «pa...
    Sarah Roux
    Python
    Python os mkdir
    Le «OS.La méthode mkdir () »du module« OS »est utilisée pour créer un répertoire unique, plusieurs r...
    Nathan Blanc
    Python
    Python Chmod
    Le «OS.Chmod () ”La fonction du module OS est utilisée pour modifier la propriété du fichier Python ...
    Lola Bonnet
    «Les balises sont pour les titres, et le«»Les balises sont utilisées pour ajouter des données de table.

    Html



















    NomJakeMarguerite
    CoursL'informatiqueLa physique
    PaysÉtats-UnisChine

    Il est observé à partir du GIF ci-dessous, les lignes de table avec l'effet de survol ont été créées avec succès:

    Comment ajouter des couleurs personnalisées aux lignes de table sur le plan de survol en bootstrap?

    Vous pouvez également spécifier une couleur de survol en fonction de vos besoins. Pour ce faire, implémentez le code suivant dans la section CSS:

    .TABLE-HOVER TBODY tr: Hover
    Color en arrière-plan: RGBA (228, 33, 205, 0.075);

    Ici:

    • Le ".tireur de table"Est la classe.
    • "tbody"Est l'élément parent du"