Bootstrap Table Hover Rows Eksempel
Denne oppskrivningen vil beskrive:
- Hvordan lage et bootstrap -bord med hosofile rader?
- Hvordan legge til tilpassede farger i bordrader på svevet i bootstrap?
Hvordan lage et bootstrap -bord med hosofile rader?
Støvelhempe "Bordskravet”Og“bord-hover”Klasser brukes til å lage et grenset bord med en sveveeffekt. “bord-hover”Klasse har en forhåndsdefinert sveveeffektstil med“:sveve”Pseudoklasse og“bakgrunnsfarge”Eiendom som har verdien”RGBA (0,0,0,.075)”.
Eksempel
La oss implementere det gjennom et eksempel:
- Lag en tabell ved å bruke HTML “
" stikkord. Tilordne det “bord”,“Bordskravet”, Og“bord-hover”Klasser.
- “”Taggen brukes til å nevne tabelloverskriften.
- I eksemplet som er nevnt nedenfor, lager vi bordkroppen ved å bruke "”Element.
- “
”Tagger brukes til å lage tabellradene,“ ”Tagger er for overskrifter, og“ ”Tagger brukes til å legge til tabelldata. Html
Navn Jake Tusenfryd Kurs Informatikk Fysikk Land forente stater Kina Det er observert fra GIF nedenfor, tabellrappene med svevetffekten er skapt med hell:
Hvordan legge til tilpassede farger i bordrader på svevet i bootstrap?
Du kan også spesifisere en svevefarge i henhold til ditt behov. For å gjøre det, implementer følgende kode i CSS -delen:
.Tabell-Hover TBody TR: Hover
Bakgrunnsfarge: RGBA (228, 33, 205, 0.075);
Her:
- “.bord-hover”Er klassen.
- “tbody”Er foreldreelementet i“
" stikkord. - “TR: Hold”Brukes til å anvende sveveeffekten på“
”Element. Produksjon
På denne måten opprettes bootstrap -tabellen med sveveeffekten.
Konklusjon
Bootstrap -tabellen med sveveeffekten opprettes ved hjelp av “bord-hover”Klasse. Denne klassen vil gi sveveteffekten på tabellradene med "bakgrunnsfarge”Eiendom som har verdien”RGBA (0,0,0,.075)”. Imidlertid kan du tilpasse svevfargen ved hjelp av CSS. Dette innlegget har beskrevet hvordan du kan legge til sveveeffekten til bootstrap -tabellen.
Hoverseffekten på bootstrap -tabellen.
- “TR: Hold”Brukes til å anvende sveveeffekten på“