Tento zápis bude ilustrovat metodu použití bodů přerušení a dotazů na média na obslužné programy „overflow“ v Tailwind CSS.
Jak využít zarážky a dotazy na média s „přetečením“ v Tailwindu?
Chcete-li v Tailwindu použít konkrétní zarážky a dotazy na média na „overflow“ nástroje, vytvořte strukturu HTML. Poté použijte „ md “ nebo „ lg ” zarážky s požadovaným 'přetečení-
Příklad
V tomto příkladu použijeme 'md' bod zlomu s 'přetečení-rolování' užitečnost v
kontejner, chcete-li do něj přidat posuvníky a vždy je zobrazit na střední obrazovce: < tělo >
< div třída = 'overflow-auto md:overflow-scroll bg-purple-300 p-4 mx-16 mt-5 h-36 text-justify' >
Tailwind CSS poskytuje různé „overflow“ nástroje, jako např
„přetečení-automatické“, „přetečení-rolování“, „přetečení-skryté“, „přetečení-viditelné“
atd. Tyto nástroje určují, jak konkrétní prvek nakládá s obsahem
která přesahuje velikost kontejneru. Každý nástroj nabízí jedinečné funkce,
jejich konečný cíl však zůstává stejný, tj. řídit přetečení
chování vybraného prvku.
< / div >
< / tělo >
Tady:
- The 'automatické přetečení' třída se používá k přidání posuvníků do kontejneru a zobrazit je pouze v případě, že je nutné rolování.
- The 'md:overflow-scroll' třída přidá posuvníky a vždy je zobrazí na 'md' bod přerušení (střední velikost obrazovky).
Výstup:
Podle výše uvedeného výstupu byly body přerušení a dotazy na média úspěšně aplikovány na obslužné programy „přetečení“.
Závěr
Chcete-li použít zarážky a dotazy na média na „overflow“ nástroje v Tailwindu, použijte „ sm “, “ md “ nebo „ lg „zarážky s požadovaným“ přetečení-