¿Qué significa! Default en un valor de propiedad css?

83

El código de arranque de Twitter tiene muchas propiedades CSS con un !defaultal final.

P.ej

p {
  color: white !default;
}

¿Qué !defaulthacer?

ACTUALIZAR

Mi mal por no ser claro. Estoy usando la parte SASS de Bootstrap.

css twitter-bootstrap sass Mordida de café
fuente
No está presente en css 2.1 w3.org/TR/CSS2
Marcin
1
nunca lo había visto antes. podría ser algo que solo se aplica al bootstrap, tal vez tengan algún tipo de análisis que busque eso
Huangism

Respuestas:

53

Twitter Bootstrap usa MENOS por lo que he visto. Por otro lado, en !defaultrealidad es parte de Sass y se usa para dar $varvalores predeterminados a las variables de Sass ( ), lo que lo haría inválido en su contexto dado, incluso en Sass .

Además, no he podido encontrar ninguna referencia !defaulten la documentación de LESS y, que yo sepa, es exclusiva de Sass. ¿Estás seguro de que encontraste esto en la fuente de Bootstrap y no en otro lugar? Porque, sinceramente, no recuerdo haber visto el código Sass / SCSS en las hojas de estilo de Bootstrap.

Por lo que vale, el único token válido que comienza con !CSS es !important, del que quizás ya conozcas .

BoltClock
fuente
1
OK, acabo de descargar y crear una copia nueva de Bootstrap y, de hecho, esto definitivamente no es de la fuente de Bootstrap ...
BoltClock
1
Podría estar equivocado, o podría estar usando un puerto Sass de Bootstrap . De cualquier manera, hizo una pregunta poco clara.
Thirtydot
@thirtydot: Interesante, no estaba al tanto de tal puerto. Sin embargo, el código dado anteriormente sigue siendo Sass inválido, y ni siquiera necesito grep del puerto Sass para saberlo.
BoltClock
@BoltClock Lo siento por la pista falsa. De hecho, estaba trabajando en el puerto SASS de Bootstrap. Aquí hay una muestra del código:$yellow: #ffc40d !default;
Coffee Bite
@Robert Pounder: O al que responde no se le ha ocurrido que pueden cambiar las respuestas aceptadas, o se han olvidado de esta pregunta (tenga en cuenta que nuestras respuestas tienen una diferencia de casi 5 años), o simplemente no les importa.
BoltClock
81

! default se usa a menudo en Bootstrap Sass. Es similar a un revés importante. Todas las variables de Bootstraps se configuran usando! Default para permitir al desarrollador personalizar aún más el bootstrap. Con! Default sass solo definirá una variable si aún no se ha configurado.

Esto permite una mayor flexibilidad. 

//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;

¿Entonces, por qué es importante? Bootstrap es un paquete. La mayoría de la gente no edita la fuente Bootstrap. NUNCA ACTUALICE LA FUENTE DE BOOTSTRAP. Para personalizar bootstrap, agregará su propio archivo variable y lo compilará con el código de bootstrap, pero nunca toque el paquete de bootstrap nativo. La página de Bootstrap Sass tiene toda la información sobre cómo personalizarla y compilarla en la documentación.

No sé por qué menos no hace esto. No he trabajado mucho con menos y no sé si tiene su propia gestión de variables incorporada.

Violín de ejemplo https://jsfiddle.net/siggysid/344dnnwz/

Sarah M Giles
fuente
1
" Para personalizar bootstrap, agregará su propio archivo variable y lo compilará con el código de bootstrap, pero nunca tocará el paquete de bootstrap nativo. La página de Bootstrap sass tiene toda la información sobre cómo personalizarlo y compilarlo en la documentación. " Tuve que buscar esto un poquito. Para cualquiera que esté interesado, aquí está el enlace (v4.3) a la página que menciona Sarah.
John E
1

Puede encontrar la siguiente definición exacta y una explicación decente en el sitio web sass-lang en su sección doc (variable) - valor predeterminado:

Normalmente, cuando asigna un valor a una variable, si esa variable ya tenía un valor, se sobrescribe su valor anterior. Pero si está escribiendo una biblioteca Sass, es posible que desee permitir que sus usuarios configuren las variables de su biblioteca antes de usarlas para generar CSS. Para que esto sea posible, Sass proporciona la bandera! Predeterminada. Esto asigna un valor a una variable solo si esa variable no está definida o su valor es nulo. De lo contrario, se utilizará el valor existente.

Aspian
fuente