Cómo aplicar !importante usando CSS

Cómo aplicar !importante usando CSS
Hay una regla utilizada con CSS para agregar importancia a una propiedad CSS en particular y se llama la "!importante" regla. Cuando un "!importante"La regla existe en el código en el elemento de estilo CSS, domina todas las demás propiedades al priorizar la compilación de esa propiedad y anula el efecto de todas las demás propiedades en ese elemento.

El "!importante"La regla en CSS toma la mayor precedencia entre todas las propiedades declaradas, todas las demás propiedades se ejecutan después de eso. Sin embargo, el "!importante"La regla puede no funcionar correctamente a veces cuando se usa en varios lugares del mismo elemento.

Aplicando !regla importante

Escribamos un código de ejemplo para comprender el impacto de la regla importante en el estilo de un documento HTML:

Esta es la primera oración


Esta es la segunda oración


Esta es la tercera oración

Aplicando !regla importante a una propiedad

  • Añade el "!importante"Regla en una de las propiedades simplemente escribiendo"importante"Con un signo de exclamación en el lado derecho de la propiedad.
  • No debe haber semicolon entre la propiedad y el "!importante"Regla porque un punto y coma siempre termina una declaración. Entonces, el punto y coma debe colocarse después de escribir "!importante".

Un ejemplo simple para agregar la regla importante a una propiedad CSS es:

.MyClass Background-Color: Blue;
#myid Background-Color: Green;
P Color de fondo: naranja !importante;

En el fragmento de código anterior, está "!importante"Escrito con una propiedad que define el color de fondo"naranja". Esta propiedad anulará las propiedades que definen los colores de fondo como verde y azul y establecerá el color del fondo de todas las oraciones en la salida como naranja.

Esto generará la siguiente interfaz de salida:

Sin el !regla importante
Ahora, si eliminamos la regla importante, el resultado será completamente diferente ya que todas las propiedades funcionarán sin anularse entre sí:

.MyClass Background-Color: Blue;
#myid Background-Color: Green;
P Color de fondo: naranja;

Establecerá los colores de fondo como azul, verde y naranja con la secuencia como la especificada a través del fragmento de código HTML. El resultado generado a través de esto será el siguiente:

Esto resume el método para aplicar la regla importante utilizando CSS.

Conclusión

El CSS "!importante"La regla agrega más importancia a una propiedad, ya que prioriza la propiedad y anula todas las demás propiedades especificadas para un elemento. El "!importante"La regla se aplica a una propiedad CSS simplemente escribiendo"importante" con un "!”(Marca de exclamación) después de la propiedad CSS antes del punto y coma. Este artículo explicó bien cómo aplicar el !regla importante que usa CSS.