Share
Vous connaissez peut-être des services tels que LESS et Sass. Ils permettent une plus grande flexibilité lors de la création de vos feuilles de style, y compris l'utilisation de variables, d'opérateurs, de mixeurs et même de sélecteurs imbriqués. Cependant, étant donné que LESS a été construit à l’origine avec Ruby, de nombreux développeurs PHP n’ont jamais utilisé la version PHP, bien qu’ils soient disponibles..
Notez que nous avons défini le rel attribuer à "stylesheet / less" et que nos feuilles de style actuelles ont une extension de .Moins, ne pas .css. Aussi, nous devons créer un lien vers cette feuille de style avant Less.js.
Avec ce minimum de travail, vous avez désormais accès à tout, des variables aux mix-ins. Assurez-vous de regarder le didacticiel vidéo de quatre minutes ci-dessus pour des exemples complets, mais voici quelques petites astuces..
/ * Variables! * / @primary_color: green; / * Les mixages sont des fonctions similaires aux opérations couramment utilisées, telles que l’application de bordures. Nous créons des variables en ajoutant le symbole @ au début. * / .rounded (@radius: 5px) -moz-border-radius: @radius; -webkit-border-radius: @radius; border-radius: @radius; #container / * Fait référence à la variable créée ci-dessus. * / background: @primary_color; / * Appelle le mix-in .rounded (fonction) que nous avons créé et remplace la valeur par défaut. * /. arrondi (20px); / * Les sélecteurs imbriqués héritent également du sélecteur de leur parent. Cela permet d'avoir un code plus court. * / a couleur: rouge;
Il est important de se rappeler que LESS.js n'est pas fini. j'espère que ce sera bientôt. Néanmoins, cela fonctionne à merveille jusqu'à présent. Qu'est-ce que tu penses?
Accentsconagua