Heim > Artikel > Web-Frontend > Spickzettel für Rückenwindbefehle
Tailwind CSS ist ein Utility-First-CSS-Framework voller Klassen, die zusammengestellt werden können, um jedes Design direkt in Ihrem Markup zu erstellen.
Tailwind CSS ist ein Utility-First-CSS-Framework, das Low-Level-Utility-Klassen zum Erstellen benutzerdefinierter Designs bereitstellt, ohne CSS schreiben zu müssen. Dieser Ansatz ermöglicht es uns, ein vollständig benutzerdefiniertes Komponentendesign zu implementieren, ohne eine einzige Zeile benutzerdefiniertes CSS zu schreiben. „Sie verschwenden keine Energie damit, Klassennamen zu erfinden“.
Es handelt sich um den Prozess des Entfernens nicht verwendeter CSS-Klassen aus der endgültigen CSS-Datei, die in der Produktionsumgebung verwendet wird. Es handelt sich um einen Optimierungsprozess, bei dem die endgültige CSS-Größe kleiner, einfacher zu warten und eine verbesserte Leistung zeigt.
Unterstreichen:
underline underline-offset-<size> decoration-<color>-<shade> //color for underline decoration-<thickness> // size of underline decoration-<style> // wavy, double
Textstil
text-<color>-<shade> //color of text text-opacity-<shade> //opacity of text text-<size> //size of text text-<alignment> //alignment of text
Hintergrundfarbe
bg-<color>-<shade>
Grenzradius
rounded-<size>
Schriftgestaltung
font-<style> //mono, serif, sans font-bold font-thin
Kursiv:
italic
Elemente ausblenden:
hidden
Anzeigen (im Gegensatz zum Ausblenden):
block
Polsterung
p-<size> /* All sides */ px-<size> /* Horizontal (left and right) */ py-<size> /* Vertical (top and bottom) */ pl-<size> /* Left */ pr-<size> /* Right */ pt-<size> /* Top */ pb-<size> /* Bottom */
Marge
m-<size> /* All sides */ mx-<size> /* Horizontal (left and right) */ my-<size> /* Vertical (top and bottom) */ ml-<size> /* Left */ mr-<size> /* Right */ mt-<size> /* Top */ mb-<size> /* Bottom */
Flexbox
flex flex-<direction> // row or column
Inhalt rechtfertigen
justify-<option>
Elemente ausrichten
items-<option> //start,end,center
Responsives Design
sm /* Small devices */ md /* Medium devices */ lg /* Large devices */ xl /* Extra large devices */
Größenbestimmung
h-<size> w-<size>
Grenzen
border border-<size> border-<color>
Schwebezustände
hover:<utility>
Das obige ist der detaillierte Inhalt vonSpickzettel für Rückenwindbefehle. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!