Que signifie !default dans une valeur de propriété css ?

Question

Le code twitter bootstrap comporte un grand nombre de propriétés CSS avec un !default à la fin.

Par exemple

p {
  color: white !default;
}

Qu'est-ce que !default faire ?

UPDATE

Je suis désolé de ne pas avoir été clair. J'utilise la partie SASS de Bootstrap.

Answer 1

!default est souvent utilisé dans Bootstrap Sass. Il est similaire à un !important inversé. Toutes les variables de Bootstrap sont définies à l'aide de !default pour permettre au développeur de personnaliser davantage Bootstrap. Avec !default, Sass ne définit une variable que si elle n'a pas déjà été définie.

Cela permet une plus grande flexibilité.

//Example1 Dress color = red
$auroras-dress-color: blue;
$auroras-dress-color: red;

//Example2 Dress color = red
$auroras-dress-color: blue !default;
$auroras-dress-color: red;

//Example3 Dress color = blue
$auroras-dress-color: blue;
$auroras-dress-color: red !default;

Alors pourquoi est-ce important ? Bootstrap est un paquet. La plupart des gens ne modifient pas les sources de Bootstrap. NE METTENT JAMAIS À JOUR LA SOURCE DE BOOTSTRAP. Pour personnaliser Bootstrap, vous ajouterez votre propre fichier de variables et le compilerez avec le code de Bootstrap, sans jamais toucher au paquet natif de Bootstrap. La page de Bootstrap sass contient tous les détails sur la façon de personnaliser et de compiler le code dans les documentations.

Je ne sais pas pourquoi moins ne le fait pas. Je n'ai pas beaucoup travaillé avec less et je ne sais pas s'il a une gestion des variables intégrée.

Exemple de violon https://jsfiddle.net/siggysid/344dnnwz/

Answer 2

Twitter Bootstrap utilise LESS, d'après ce que j'ai vu. D'un autre côté, !default fait en fait partie de Sass et est utilisé pour donner des variables Sass ( $var ) par défaut, ce qui le rendrait invalide dans votre contexte donné, même dans Sass .

En outre, je n'ai pas été en mesure de trouver des références à !default sur la documentation LESS et, à ma connaissance, il est exclusif à Sass. Êtes-vous sûr d'avoir trouvé cela dans les sources de Bootstrap et pas ailleurs ? Parce que, honnêtement, je ne me souviens pas avoir vu du code Sass/SCSS dans les feuilles de style de Bootstrap.

Pour ce que ça vaut, le seul jeton valide qui commence par ! en CSS est !important , dont vous êtes peut-être déjà au courant .

Answer 3

Vous pouvez trouver la définition exacte suivante et une explication décente dans sass-lang site web dans sa section doc (variable) - valeur par défaut :

Normalement, lorsque vous attribuez une valeur à une variable, si cette variable avait déjà une valeur, son ancienne valeur est écrasée. Mais si vous écrivez une bibliothèque Sass, vous voudrez peut-être permettre à vos utilisateurs de configurer les variables de votre bibliothèque avant de les utiliser pour générer du CSS. Pour ce faire, Sass fournit l'indicateur !default. Celui-ci attribue une valeur à une variable uniquement si celle-ci n'est pas définie ou si sa valeur est nulle. Sinon, la valeur existante sera utilisée.