Nouvelles propriétés CSS Cool Tailwind-tutoriel CSS-php.cn

Nouvelles propriétés CSS Cool Tailwind

DDD

Libérer： 2024-09-13 16:16:32

original

708 Les gens l'ont consulté

New Cool Tailwind CSS Properties

J'aime la façon dont ils évoluent en prenant également soin de l'accessibilité

Commençons par les nouveautés de Tailwind CSS après la version 3, je serai peut-être en retard car la version 3.4 est la dernière.

La plupart d'entre nous ne mettent généralement pas à jour nos packages dans le référentiel à moins que cela ne soit requis ou devienne obligatoire ?

Je peux comprendre ce sentiment et c'est pourquoi au moins je pense que nous mettrons à jour le package uniquement à chaque fois que nous créons un nouveau référentiel ?

Pour en revenir au fait, j'utilise Tailwind CSS depuis 4 ans et j'en suis amoureux. La plupart d'entre nous pourraient faire valoir que l'écriture de CSS tailwind ne fera pas de vous un bon développeur front-end lorsqu'il s'agit de styliser une partie ou un CSS de base.

Au fil du temps, j'ai constaté que les CSS Tailwind posaient certains problèmes liés à l'écriture de CSS simples, mais cela est principalement lié à la syntaxe, les concepts de base de style des éléments et d'ajout d'animations sont toujours les mêmes.

Juste une différence de syntaxe

CSS in JSX
transform: “”, 

Tailwind CSS
transform:transition-all,

Copier après la connexion

Maintenant, une fois que vous aurez compris les bases, la syntaxe ne fera plus beaucoup de différence.

Pour écrire des animations, je préfère CSS dans JSX et pour un style simple, j'utilise Tailwind et c'est pourquoi la plupart des référentiels offrent la flexibilité permettant au développeur d'écrire dans sa syntaxe favorable.

Quoi de neuf ou d’intéressant dans Tailwind CSS ?

Les développeurs de Tailwind travaillent également très dur sur l'accessibilité et les animations.

Les développeurs ont exprimé leur inquiétude quant à l'écriture d'animations complexes à l'aide de Tailwind CSS, tout comme nous l'avons fait avec du CSS simple ou d'autres bibliothèques d'animation comme GSAP ou framer-motion.

Diviser

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

La plupart du temps, nous souhaitons ajouter des séparateurs entre les colonnes et c'est ce que fait la propriété Divider sous le capot. Ajoutez une largeur de bordure aux éléments disposés dans un ordre flexible qui nécessite une apparence de séparation.