Imágen como fondo CSS

15/10/09

Mediante la propiedad "BACKGROUND-IMAGE" del CSS, se puede colocar una imágen como fondo de una página o bloque, logrando muchos efectos visuales controlando la posición y comportamiento de la imágen de fondo.

Ejemplo:

veamos un ejemplo sencillo de colocación de una imágen como fondo de un bloque:

Código CSS:

body{background:#fff;}
.imagen{background-image:url(fondo.jpg);
            width:430px;
            margin:0 auto;
            text-align:justify;
            color:#eee;
            padding:8px;
            }

Donde:

La propiedad background hace referencia a una imágen llamada 'fondo.jpg' que se aplicara al bloque llamado '.imagen'

Código HTML:

Agregaremos el atributo class="imagen" al bloque o bloques que tendra una imagen como fondo:

<body>
<div class="imagen">
Este bloque tendra una imágen como fondo
</div>
</body>

Ver Ejemplo: Imágen como fondo CSS

Descargar Ejemplo: Imágen como fondo CSS

DISEÑO WEB CSS

Maquetación CSS

Maquetación con CSS, HTML flotar bloques, layout o cajas. Diseño web estandar, colores CSS, ancho, alto.

Imágenes y CSS

Códigos CSS para imágenes, casos prácticos, ejemplos.

Tipografía, texto CSS

Volumen de letras, fuentes, tipografía, interlineado, tamaño de texto, subrayado, efectos de texto:

Menus, enlaces con CSS

Aprenderemos a estructurar y diseñar todo tipo de menus con CSS mediante ejemplos y casos prácticos.

Diseño Web

Manuales

Programas

Recursos Gratis

Imágen como fondo CSS

DISEÑO WEB CSS

Maquetación CSS

Imágenes y CSS

Tipografía, texto CSS

Menus, enlaces con CSS