I love how they are evolving by taking care of accessibility as well
Let’s begin with what’s new in Tailwind CSS after version 3, I might be late as version 3.4 is the latest one.
Most of us usually don’t update our packages in the repository unless it’s required or becomes mandatory ?
I can understand that feeling and that is why most at least I am thinking will only upgrade the package whenever we are creating a new repository ?
Coming back to the point, I have been using Tailwind CSS for the past 4 years and I am in love with it. Most of us might raise an argument that writing tailwind CSS won’t make you a good front-end developer when it comes to styling part or core CSS.
Over time, I’ve experienced that tailwind CSS do bring some problems related to writing simple CSS but that’s mostly related to syntax thing the core concepts of styling the elements and adding animations are still the same.
Just a syntax difference
CSS in JSX transform: “”, Tailwind CSS transform:transition-all,
Now once you understand the basics the syntax won’t make much difference.
For writing animations, I prefer CSS in JSX and for simple styling, I go with Tailwind and that is why most of the repositories do come with flexibility for the developer to write in his/her favourable syntax.
Tailwind devs are working very hard on accessibility and animations as well.
Developers have raised a concern for writing complex animations using Tailwind CSS just like we did with simple CSS or other animation libraries like GSAP or framer-motion.
https://tailwindcss.com/docs/divide-style
Most of the time we want to add dividers between the columns and that is what Divider property does under the hood. Add border width to the elements arranged in a flex order that needs a dividing appearance.
https://tailwindcss.com/docs/background-image#linear-gradients
https://tailwindcss.com/docs/screen-readers
https://tailwindcss.com/docs/caret-color
https://tailwindcss.com/docs/scroll-snap-type
https://tailwindcss.com/docs/resize
https://tailwindcss.com/docs/appearance?source=post_page-----eeea98808df1
https://tailwindcss.com/docs/accent-color
That’s it for today, see you in the next one
Feel free to follow and subscribe!!
Shrey
The above is the detailed content of New Cool Tailwind CSS Properties. For more information, please follow other related articles on the PHP Chinese website!