Denne opskrivning vil illustrere metoden til at anvende breakpoints og medieforespørgsler på 'overflow'-værktøjerne i Tailwind CSS.
Hvordan udnytter man brudpunkter og medieforespørgsler med 'overløb' i medvind?
For at anvende bestemte breakpoints og medieforespørgsler på 'overflow'-værktøjer i Tailwind skal du oprette en HTML-struktur. Brug derefter ' md ' eller ' lg ” brudpunkter med det ønskede 'overløb-
Eksempel
I dette eksempel vil vi bruge 'md' brudpunkt med 'overløb-scroll' nytte i
beholder for at tilføje rullepanelerne til den og viser dem altid på medium skærmstørrelse: < legeme >
< div klasse = 'overflow-auto md:overflow-scroll bg-lilla-300 p-4 mx-16 mt-5 h-36 tekst-justify' >
Tailwind CSS leverer forskellige 'overflow'-værktøjer, som f.eks
'overløb-auto', 'overløb-scroll', 'overløb-skjult', 'overløb-synlig'
osv. Disse hjælpeprogrammer bestemmer, hvordan et specifikt element håndterer indholdet
der overstiger beholderens størrelse. Hvert hjælpeprogram tilbyder unik funktionalitet,
deres endemål forbliver dog det samme, dvs. at kontrollere overløbet
det valgte elements adfærd.
< / div >
< / legeme >
Her:
- Det 'overløbsautomatik' klasse bruges til at tilføje rullepanelerne til beholder og vis dem kun, når det er nødvendigt at rulle.
- Det 'md:overflow-scroll' klasse tilføjer rullepanelerne og viser dem altid på 'md' brudpunkt (mellem skærmstørrelse).
Produktion:
Ifølge ovenstående output er brudpunkter og medieforespørgsler blevet anvendt med succes på 'overløbs'-værktøjerne.
Konklusion
For at anvende breakpoints og medieforespørgsler på 'overflow'-værktøjer i Tailwind, skal du bruge ' sm ', ' md ' eller ' lg ” brudpunkter med det ønskede ” overløb-