Proposition pour CSS @When

Le champ CSS s'est développé rapidement récemment. J'ai entendu parler de quelque chose de nouveau que je n'avais jamais vu auparavant, et j'ai aussi appris par Miriam: les déclarations conditionnelles du CSS.

? Ceci est la proposition: https://www.php.cn/link/2d3bd60a2d899b49827efa1d74476809

- Mia, à la basse (@terriblemia) 15 septembre 2021

La logique existe déjà dans les requêtes médiatiques. En fait, les requêtes médiatiques sont une sorte de logique en soi.

 <code>@media (min-width: 600px) { /* 当此媒体查询为真时，执行这些样式。 */ }</code>

Si vous voulez un style mutuellement exclusif, vous devez écrire deux requêtes multimédias:

 <code>@media (min-width: 600px) { /* ... */ } @media (max-width: 599px) { /* ... */ }</code>

C'est un peu ... lourd. La grammaire de la nouvelle proposition est beaucoup plus simple:

 <code>@when media(min-width: 600px) { /* ... */ } @else { /* ... */ }</code>

Il semble que vous puissiez créer une pile logique en cascade en utilisant et en utilisant plusieurs conditions, en utilisant plusieurs instructions @ELSE, et non seulement à l'aide de @Media, mais aussi à l'aide de @Supports.

 <code>@when media(width >= 400px) and media(pointer: fine) and supports(display: flex) { /* A */ } @else supports(caret-color: pink) and supports(background: double-rainbow()) { /* B */ } @else { /* C */ }</code>

À mon avis, c'est très logique et pratique!

J'ai vu un petit argument sur la dénomination. @if peut également être un nom logique. Mais SASS utilise @IF, qui sera très ennuyeux pour un grand nombre de développeurs s'ils doivent refactor toute la logique Sass en quelque chose de nouveau, ou si cela se produit de toute façon. CSS devrait-il céder à un préprocesseur? Non, mais Sass existe depuis longtemps et est très populaire et a une très bonne alternative, alors pourquoi causer de la douleur? Dans cette discussion, il ne s'agissait pas seulement de SASS - certaines personnes pensent que @When est un meilleur nom en soi.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!