logo

¿Cómo agregar una imagen de fondo en CSS?

El imagen de fondo La propiedad en CSS se utiliza para establecer una imagen como fondo de un elemento. Usando esta propiedad CSS, podemos establecer una o más imágenes de fondo para un elemento.

De forma predeterminada, la imagen se coloca en la esquina superior izquierda de un elemento y se repite tanto horizontal como verticalmente. La imagen de fondo debe elegirse según el color del texto. La mala combinación de texto e imagen de fondo puede ser la causa de que una página web esté mal diseñada y no sea legible.

El URL() El valor de esta propiedad nos permite incluir una ruta de archivo a cualquier imagen. Mostrará el fondo del elemento. Podemos usar múltiples imágenes o una mezcla de degradados e imágenes para el fondo. Si la imagen de fondo no se carga o si estamos usando los degradados, pero no son compatibles con el navegador correspondiente, entonces podemos usar el valor alternativo (el valor usado como sustitución) como color de fondo del elemento.

clasificación de conchas

Sintaxis

 background-image: url(); 

Valores

URL(): Es la URL de la imagen. Podemos separar las URL por una coma si queremos especificar más de una imagen.

tamaño de fuente látex

Ejemplo

 body { background-image: url('cat.webp'); background-color: lightgray; } 
Pruébalo ahora

Producción

Cómo agregar una imagen de fondo en CSS

Ejemplo

 body { height: 200px; background-color: #cccccc; background-image: radial-gradient(red, green, yellow); } 
Pruébalo ahora

Producción

Cómo agregar una imagen de fondo en CSS

Ejemplo

 body { height: 200px; background-color: #cccccc; background-image: linear-gradient(rgba(0, 0, 255, 0.5),rgba(255, 255, 0, 0.5)), url('lion.webp'); } 
Pruébalo ahora

Producción

Cómo agregar una imagen de fondo en CSS