Autres regards sur l'astuce du rayon de la frontière conditionnelle

Rappelez-vous qu'Ahmad Shadeed, Facebook CSS Border-Radius, a été "Toggle"? J'ai déjà couvert cette technique intelligente. Des articles ultérieurs offraient une analyse plus approfondie.

«Évaluer les solutions CSS intelligentes de Michelle Barker remet en question la sagesse du code trop intelligent:

Bien que indéniablement ingénieux et fascinant, je suis d'accord avec le commentaire de la newsletter CSS-Tricks de Robin Rendle: "C'est un peu trop intelligent."

Ce sentiment résonne. Ces techniques ont leur place, peut-être dans les ressources de Facebook. Cependant, la priorité à la lisibilité (par exemple, l'utilisation de requêtes multimédias) sur des solutions intelligentes mais potentiellement moins maintenables est généralement préférable.

Stefan Judis a exploré la réalisation du même effet "Conditional Border-Radius" en utilisant les prochaines requêtes de conteneur:

 / * Si la largeur du conteneur est égale ou supérieure à 
   La largeur de la fenêtre, retirez le radius frontalier * /
@Container (largeur> = 100vw) {
  .
    Border-Radius: 0;
  }
}

Cette approche est beaucoup plus claire. Stefan suggère également les avantages potentiels d'une caractéristique hypothétique @when :

 @when conteneur (largeur> = 100vw) {
  .
    Border-Radius: 0;
  }
}
@autre {
  .
    Border-Radius: 1em;
  }
}

La faisabilité de cette intégration @when reste incertaine. Cependant, son inclusion améliorerait la lisibilité et la cohérence logique de CSS.

Un article précédent a brièvement mentionné le rôle de la multiplication dans la prévention des valeurs intermédiaires: le résultat est soit 8px ou 0px. Pour clarifier cela, une démonstration vidéo est incluse ci-dessous. (Remarque: une vidéo serait insérée ici dans la publication réelle.)

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!