Hvordan lage teksterbare/dynamiske faner i bootstrap 5

Hvordan lage teksterbare/dynamiske faner i bootstrap 5

Tåleplater/dynamikk -faner eller piller har en kraftig mekanisme i Bootstrap 5 som opprettes for å navigere gjennom en enorm mengde data i et lite område. Dette deler innholdet i forskjellige ruter, og hver rute er synlig om gangen. Dette hjelper brukeren med å enkelt og raskt få tilgang til innholdet ved å bytte mellom ruter uten å forlate siden.

Denne artikkelen gir deg informasjon om

  • Hvordan lage tyttbare og dynamiske faner?
  • Hvordan lage vekslebare og dynamiske piller?

Hvordan lage teksterbar og dynamisk fan

For å opprette teksterbare faner, legg til attributtet Data-BS-Toggle = “Tab” til hvert ankerkode og gi en unik ID til hver fane. Lag etterpå en tag med klassen .Tab-rute, og pakk dem inn i en tag med en klasse .Tab-innhold. Til slutt, gi dem en overgangseffekt med klassen .falme hvis du vil.






Dette er en meldingsfane.
Dette er en profilfane.
Dette er en innstillingsfane.

Slik oppretter du teksterbare/dynamiske faner.

Hvordan lage vekslebare og dynamiske piller

For å opprette teksterbare faner, legg til attributtet data-bs-toggle = “pille” til hvert ankerkode og gi en unik ID til hver fane. Lag etterpå en tag med klassen .Tab-rute, og pakk dem inn i en tag med en klasse .Tab-innhold. Til slutt, gi dem en overgangseffekt med klassen .falme.



<
!-- Tabruter ->

Dette er en meldingsfane ved hjelp av Pill Data-Toggle-attributt.
Dette er en profilfane ved hjelp av Pill Data-Toggle-attributt.
Dette er en innstillingsfane ved hjelp av Pill Data-Toggle-attributt.

Dette er hvordan du lager teksterbare/dynamiske piller.

Konklusjon

Tålebare/dynamiske faner opprettes for å håndtere eller vise store datamengder innen et spesifikt eller lite område, skille den ved hjelp av ruter, og hver rute er synlig en om gangen. Brukere kan bytte gjennom forskjellige faner for å se innholdet uten å forlate siden. Toggable/dynamiske faner i Bootstrap 5 brukte ingen rullegardinmenyer fordi det gjorde brukervennlighet og tilgjengelighetskompleks og vanskelig.