Comment puis-je empêcher Less de compiler incorrectement les propriétés CSS `calc()` ?

Empêcher la compilation des propriétés CSS calc()

Les compilateurs Less rencontrent souvent des problèmes lorsqu'ils tentent de compiler les propriétés CSS définies à l'aide de calc() fonction. Par exemple, l'entrée :

body { width: calc(100% - 250px - 1.5em); }

peut être traduite de manière inattendue par :

body { width: calc(-151.5%); }

Cette transformation inexacte peut entraîner des résultats indésirables.

Solution en moins

Less versions 3.00 et supérieures n'évaluent plus les expressions dans calc() par défaut. Par conséquent, l'entrée fournie ne sera pas modifiée lors de la compilation.

Pour les versions Less antérieures à 3.00, vous pouvez échapper au calcul à l'aide de l'opérateur ~ :

body { width: calc(~"100% - 250px - 1.5em"); }

Option mathématique stricte dans Less

Less versions 1.4.0 ont introduit une option strictMaths. Lorsque cette option est activée, tous les calculs Moins doivent être mis entre parenthèses. Dans ce cas, le calcul dans calc() sera respecté et non évalué lors de la compilation. Notez que cette option peut casser le code existant, elle doit donc être utilisée avec prudence.

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!