CSS Unset
En este tutorial, utilizaremos este valor no establecido en nuestro código CSS y presentaremos cómo funciona. Exploraremos ejemplos en los que aplicamos algunas propiedades y luego usamos el "Unset" para las propiedades de cancelar o deshacer."
Ejemplo 1
Comenzaremos a escribir HTML creando un nuevo archivo en el código de Visual Studio y la elección de HTML como idioma. Se ha generado el archivo, y todo lo que necesitamos hacer ahora es agregar el "!"Mark para obtener las etiquetas básicas. Como resultado, presionar "Enter" hace que el archivo muestre todas las etiquetas básicas de HTML. El cuerpo es la sección desde donde comenzamos a codificar. Simplemente ponemos un encabezado "H1" y un párrafo "P" en el cuerpo. También proporcionamos un enlace al archivo CSS dentro de la "Cabeza" en esta plantilla HTML. Mira cómo funciona este valor no establecido en CSS.
Vamos a diseñar tanto el encabezado como el párrafo. Establecemos el encabezado "Font-Family" primero, y estamos seleccionando "Calibri" para esto. También cambiamos su "color", y establecemos "rojo" para esto. Ahora, también tenemos un párrafo, y aquí simplemente cambiamos el "color" del párrafo. Ahora queremos deshacer el color del párrafo. Entonces, para esto, utilizamos el valor "unset" para el "color" del párrafo, por lo que este color "verde" no se aplica al texto del párrafo.
La salida muestra que el color del encabezado y la familia de fuentes cambian, pero el color del párrafo permanece sin cambios. Aquí puede ver que el color verde no se aplica aquí al texto del párrafo porque desanimamos la propiedad de color del párrafo.
Ejemplo 2
Estamos utilizando el mismo código HTML aquí que hemos creado en nuestro ejemplo anterior. Estilizamos el encabezado utilizando dos propiedades. Una de ellas es la propiedad de la "Fuente-Familia", y establecemos esta propiedad como "Argelina."La segunda propiedad que estamos usando aquí para el encabezado es la propiedad" color ", y usamos" azul "aquí. También aplicamos múltiples propiedades al párrafo aquí. El "color" de este párrafo es "verde", y el tamaño de la fuente del párrafo es "24px". También usamos el "Times New Roman" como la "familia de fuentes."Utilizamos la propiedad de" decoración de texto "para generar el subrayado para el encabezado. Establecemos el valor de "decoración de texto" como "subrayar."
Ahora, estamos utilizando la palabra clave "en negrita" para el "peso de fuente" y alineando este párrafo en el "Centro" utilizando la propiedad "Alineación de texto". Pero ahora, no queremos aplicar todas estas propiedades a nuestro párrafo, por lo que en lugar de escribir todas las propiedades por separado y luego usar el valor "Unset" en cada propiedad, simplemente ponemos "todo" y establecemos su valor en "Unset" para el párrafo. Nuestro párrafo permanecerá sin cambios, y no se aplicarán propiedad o estilo al párrafo.
La familia de color y fuente del encabezado se ha cambiado, mientras que el párrafo no ha cambiado. Porque todas las propiedades que hemos aplicado al párrafo han sido inseguros al utilizar "todos: unset" en CSS.
Ejemplo 3
En este código HTML dado, vamos a poner un encabezado y un DIV aquí y avanzar al CSS para aplicarles el estilo y cancelar o no usar algunos estilos usando "Unset."
Simplemente aplicamos algunas propiedades en el DIV. Aquí, establecemos su "tamaño de fuente" y colocamos el valor del "tamaño de la fuente" como "24px". También utilizamos "en negrita" para el "Font-Weight."El" color "que elegimos aquí para este div es" rojo ", y la" familia de fuentes "que estamos seleccionando aquí es" Arial."Ahora, no necesitamos cambiar el" color "y el" peso de fuente "de este div, así que solo colocamos estas dos propiedades dentro de los frenos Div Curly y colocamos" Unset "para ambos. Las propiedades restantes se aplicarán al elemento DIV, pero las propiedades de color y peso de fuente no se aplicarán al DIV a medida que no estemos en estas propiedades aquí.
La salida se presenta aquí, y puede ver que la "familia de fuentes" y el "tamaño de la fuente" se cambia aquí de acuerdo con los valores que hemos establecido en el código CSS, pero no hay efecto en el "peso de fuente" y "color" del div. Esto se debe a que desanimamos estos valores. De esta manera, podemos anular algunas propiedades utilizando el nombre de la propiedad y establecer el valor "no establecido" para esta propiedad.
Ejemplo 4
Vamos a colocar uno en la que se dirige aquí y luego poner un párrafo; Después de este párrafo, también pusimos un elemento Div aquí, y al final, colocamos un elemento de tramo. Vamos a diseñar todo esto y luego desanimarlos todos en CSS. Mire el archivo CSS y vea cómo haremos esto.
El encabezado "Font-Family" es la primera propiedad que establecemos, y elegimos "Argeliano" para ello. También ajustamos su "color", que establecemos en "púrpura" y "centré" este encabezado también, utilizando el "texto alineado."Ahora tenemos un párrafo, y todo lo que debemos hacer es cambiar el" color "del párrafo. El valor del atributo de "color" se establece en "verde" en este caso. El "tamaño de fuente" aquí es "24px". Como una propiedad de "fuente de fuente", también utilizamos "Times New Roman."El atributo" Decoración de texto "se utiliza para crear el subrayado del texto. El valor de "decoración de texto" se estableció en "subrayar."Ahora estamos usando la palabra clave" en negrita "para la propiedad" Font-Weight "y la propiedad" Align "para colocar este párrafo en el" Centro."
Ahora, para el DIV, estamos utilizando las mismas propiedades pero cambiando los valores de estas propiedades aquí. En esta situación, el valor del atributo de "color" es "rojo."El" tamaño de fuente "es" 22px "en este caso. También usamos "Calibri" como una propiedad de "Fuente-Familia". El valor para la "decoración del texto" se cambió a "subrayar."Para poner este DIV en el medio, estamos usando la propiedad" Align de texto "y lo establecemos como" Centro."
Después de esto, tenemos SPAN, "Azul" es el valor de la propiedad "Color" del SPAN. En este caso, el "tamaño de fuente" es "20px". "Cambria" también se establece aquí como un valor de la propiedad "Font-Family". También cambiamos el "estilo de fuente" de este lapso a "cursiva."El valor de" Decoración de texto "que estamos usando aquí es" Subrayar."Le mostraremos cómo se verá cuando todas las propiedades se apliquen a ellas y también cuándo ninguna propiedad se aplicará a ellas. Le mostraremos dos salidas aquí, por lo que aprenderá fácilmente la diferencia antes de usar "Unset" y después de usar el valor "Unset" para "todas" propiedades.
Mira esta primera salida aquí; Todas las propiedades se aplican al encabezado, párrafo, div y tramo porque no usamos "unset" aquí con ninguna propiedad. Ahora, avance y verifique cómo mostrará la salida cuando usemos "Unset."
En este archivo CSS, solo agregamos "All: Unset" para el encabezado, el párrafo, el div y el tramo. Significa que "desanimamos" todas las propiedades que hemos solicitado para todas ellas.
La salida le muestra que no hay propiedad aplicada en ningún encabezado, párrafo, DIV y elemento de tramo. Esto es solo por el valor "unset" que hemos utilizado para "todos."
Conclusión
Este tutorial fue desarrollado para ayudarlo a aprender el valor "no establecido" de CSS que nos permite deshacer algunas propiedades y también deshacer todas las propiedades simplemente colocando este "unset" allí. Este tutorial ha pasado por este tema en detalle. Revisamos cuatro ejemplos diferentes aquí en los que hemos utilizado este valor "no establecido", así como las salidas, por lo que comprenderá fácilmente cómo funciona este valor "no establecido". Hemos utilizado el valor "unset" por separado de los nombres de la propiedad y también usamos esto con la propiedad "All" que canceló todas las propiedades que hemos aplicado en los ejemplos. Espero que puedan desanimar sus propiedades en CSS después de seguir correctamente este tutorial.