Neue coole Tailwind-CSS-Eigenschaften

Ich finde es toll, wie sie sich weiterentwickeln, indem sie auch auf die Zugänglichkeit achten

Beginnen wir mit den Neuerungen in Tailwind CSS nach Version 3. Ich komme möglicherweise zu spät, da Version 3.4 die neueste ist.

Die meisten von uns aktualisieren ihre Pakete im Repository normalerweise nicht, es sei denn, dies ist erforderlich oder wird obligatorisch?

Ich kann dieses Gefühl verstehen und deshalb denke ich zumindest, dass wir das Paket nur aktualisieren werden, wenn wir ein neues Repository erstellen?

Um auf den Punkt zurückzukommen: Ich verwende Tailwind CSS seit vier Jahren und bin darin verliebt. Die meisten von uns werden vielleicht argumentieren, dass das Schreiben von Rückenwind-CSS Sie nicht zu einem guten Front-End-Entwickler macht, wenn es um die Gestaltung von Teil- oder Kern-CSS geht.

Im Laufe der Zeit habe ich die Erfahrung gemacht, dass Rückenwind-CSS zwar einige Probleme beim Schreiben von einfachem CSS mit sich bringt, aber das hängt hauptsächlich mit der Syntax zusammen. Die Kernkonzepte des Stils der Elemente und des Hinzufügens von Animationen sind immer noch dieselben.

Nur ​​ein Syntaxunterschied

CSS in JSX
transform: “”, 

Tailwind CSS
transform:transition-all, 

Sobald Sie die Grundlagen verstanden haben, wird die Syntax keinen großen Unterschied mehr machen.

Zum Schreiben von Animationen bevorzuge ich CSS in JSX und für einfaches Styling verwende ich Tailwind. Aus diesem Grund bieten die meisten Repositorys dem Entwickler die Flexibilität, in seiner bevorzugten Syntax zu schreiben.

Was ist neu oder cool in Tailwind CSS?

Tailwind-Entwickler arbeiten auch sehr hart an Barrierefreiheit und Animationen.

Entwickler haben Bedenken geäußert, komplexe Animationen mit Tailwind CSS zu schreiben, genau wie wir es mit einfachem CSS oder anderen Animationsbibliotheken wie GSAP oder Framer-Motion gemacht haben.

Teilen

https://tailwindcss.com/docs/divide-style

Meistens wollen wir Trennlinien zwischen den Spalten hinzufügen und genau das macht die Divider-Eigenschaft unter der Haube. Fügen Sie den in einer flexiblen Reihenfolge angeordneten Elementen, die ein trennendes Erscheinungsbild benötigen, eine Rahmenbreite hinzu.

Lineare Farbverläufe

https://tailwindcss.com/docs/background-image#linear-gradients

Bildschirmleseprogramme

https://tailwindcss.com/docs/screen-readers

Caret-Styling

https://tailwindcss.com/docs/caret-color

Snap-Steuerung

https://tailwindcss.com/docs/scroll-snap-type

Größe ändern

https://tailwindcss.com/docs/resize

Aussehen

https://tailwindcss.com/docs/appearance?source=post_page-----eeea98808df1

Akzentfarbe

https://tailwindcss.com/docs/accent-color

Das war's für heute, wir sehen uns im nächsten

Folgen Sie uns gerne und abonnieren Sie es!!

Shrey

Das obige ist der detaillierte Inhalt vonNeue coole Tailwind-CSS-Eigenschaften. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!