Faking Env () pour l'utiliser maintenant

env() de CSS n'est pas apparue à partir de l'air mince. Il a été à l'origine utilisé par Apple pour gérer les "écrans Notch" et est maintenant devenu un projet de spécification. Son objectif est de permettre à l'agent ou auteur utilisateur de déclarer des variables inchangées, similaires aux constantes mondiales dans CSS.

Cependant, la spécification n'a pas précisé comment définir env() . Si vous devez l'utiliser maintenant, le moyen le plus simple est d'utiliser des propriétés personnalisées CSS normales et d'éviter de les modifier.

Si vous souhaitez utiliser env() , vous pouvez utiliser un plugin PostCSS pour le simuler. Le plugin déclare les variables via un fichier javascript:

 posctCSSCustomProperties ({
  ImportFrom: 'path / to / file.js' / * module.exports = {
    Environment Variables: {
      '- branding-padding': '20px',
      '- Branding-Small': '600px'
    }
  } * /
});

Il est intéressant de définir des variables de JavaScript car cela signifie que nous pouvons nous concentrer sur la définition des variables en un seul endroit et y accéder dans JavaScript et CSS.

Harry Nicholls le présente plus en détail dans son article "Pourquoi vous devriez utiliser CSS Env ()", comme certaines notes lorsqu'ils traitent avec des unités. Cependant, si vous avez besoin d'utiliser une variable non échangeable de source unique dans CSS et JavaScript, il s'agit d'une bonne solution et peut être supprimée après que env() est officiellement pris en charge.

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!