CSS proporciona múltiples propiedades que ayudan a crear un sitio web fascinante y la propiedad de fondo es una de las propiedades más importantes que nos permiten establecer el fondo de cualquier elemento específico, página web, etc. Individualmente, cada propiedad realiza una funcionalidad única, sin embargo, CSS proporciona algunas funcionalidades para combinar múltiples propiedades dentro de una sola propiedad. La combinación de múltiples propiedades de fondo en una sola propiedad de fondo se conoce como la propiedad de mortificación de fondo.

Propiedad de fondo de antecedentes

Es una propiedad en taquigrafía que puede tomar múltiples valores simultáneamente. Es un método de taquigrafía para las siguientes propiedades:

• repetición
• imagen de fondo
• atacamiento de antecedentes
• tamaño de fondo
• color de fondo
• posición de fondo
• origen
• clip de fondo

La propiedad de fondo está representada por "fondo". Puede combinar cualquiera de las propiedades mencionadas anteriormente en el fondo Propiedad abreviada de acuerdo con su necesidad.

Sintaxis

La propiedad de mortificación de fondo sigue la siguiente sintaxis:

Antecedentes: Color de fondo-imagen de fondo Repeat de fondo;

De la sintaxis dada anteriormente se puede observar que el fondo La propiedad abreviada toma múltiples propiedades separadas por el espacio. La propiedad de fondo sigue un orden específico para especificar las múltiples propiedades.

Aquí, antes de saltar a la orden de propiedades de fondo, primero entenderemos cómo funcionan estas propiedades como individuo. Por lo tanto, consideraremos algunas de las principales propiedades de fondo junto con ejemplos.

color de fondo

Una propiedad que determina el color de fondo de un elemento.

Ejemplo
Este ejemplo establecerá el color azul claro como color de fondo del elemento del cuerpo:

Imagen de fondo

Bienvenido a Linuxhint.comunicarse

La salida del código anterior será así:

imagen de fondo

La propiedad de la imagen de fondo se utiliza para implementar imágenes simples o múltiples en el fondo de un elemento.

Ejemplo
Este código dado a continuación agregará una imagen usando el imagen de fondo propiedad:

Imagen de fondo

Bienvenido a Linuxhint.comunicarse

Obtendremos la siguiente salida:

repetición

La propiedad de repetición de fondo habilita o deshabilita la repetición para la imagen de fondo. Por defecto, la imagen se repite en ambas direcciones I.mi. horizontal Vertical. Sin embargo, utilizando la propiedad de repetición de fondo, podemos establecer la repición de acuerdo con nuestra necesidad e.gramo. Repetir y para repetición vertical, repetir x para repetición horizontal o sin repetición para evitar repetición.

Ejemplo
En el ejemplo anterior no especificamos la propiedad de repetición de fondo, por lo tanto, la imagen repetida en horizontal y verticalmente. Sin embargo, el código dado a continuación utiliza el valor sin repetición para deshabilitar la repetición:

Imagen de fondo

Bienvenido a Linuxhint.comunicarse

Ahora esta vez la imagen de fondo aparecerá solo una vez como se muestra en la siguiente salida:

posición de fondo

La propiedad de la posición de fondo determina la posición de la imagen de fondo como la izquierda, la parte superior, la derecha, la parte inferior, etc.

Ejemplo
El siguiente ejemplo dado establecerá la imagen de fondo en el centro de la página:

Imagen de fondo

Bienvenido a Linuxhint.comunicarse

El código anterior producirá la siguiente salida:

Del mismo modo, hay algunas otras propiedades que pueden usarse para el fondo, como:

• El alcance de fondo especifica que la imagen se solucionará para toda la página o puede desplazarse
• El tamaño de fondo se utiliza para establecer el tamaño de la imagen de fondo
• El origen de fondo determina el origen de la imagen de fondo

Orden de propiedad de antigüedad de antecedentes

Mientras trabajamos con la propiedad de la taquigrafía de fondo, tenemos que definir las propiedades en un orden específico como se muestra a continuación:

• Primero tenemos que escribir el color de fondo
• Entonces el segundo valor es para la imagen de fondo
• Se especifica el tercer valor para la repetición de fondo
• El atacamiento de fondo viene después de la repetición de fondo
• Posteriormente se escribe el valor de la posición de fondo

Podemos omitir cualquier propiedad dependiendo del escenario, pero tenemos que escribir las otras propiedades en el orden adecuado.

Ejemplo
En el ejemplo anterior (posición de fondo) utilizamos tres propiedades diferentes. Escribimos cada propiedad por separado, que es un proceso de tiempo. Sin embargo, estas propiedades se pueden agrupar en una propiedad como se muestra a continuación:

Imagen de fondo

Bienvenido a Linuxhint.comunicarse

En el código dado anteriormente escribimos tres propiedades: imagen de fondo, repetición de fondo y posición de fondo dentro de la propiedad de fondo abreviado. Mostrará la siguiente salida:

Conclusión

La propiedad de fondo de fondo nos permite establecer múltiples propiedades de fondo dentro de una sola propiedad simultáneamente. Las propiedades de la taquigrafía de fondo siguen un orden específico para establecer múltiples propiedades dentro de la propiedad de fondo. En este artículo, hemos aprendido qué es una propiedad de fondo de fondo, qué propiedades se pueden usar dentro del fondo propiedad. Posteriormente, este artículo determina un orden específico para las propiedades.