te recomiendo que identifiques en primer lugar el DIV en cuestión: <div
id="div1">
y luego definas la regla div#div1
que podrá contener color y/o imagen de fondo
esta imagen se podrá repetir por todo el lienzo del div, o solo
verticalmente (una columna con la imagen repetida que ocupe todo el alto) u
horizontalmente (una linea con la imagen repetida que ocupe todo el ancho) o
que no se repita.
puedes posicionarla con medidas (por ejemplo con ´pixeles) con porcentajes o
con las palabritas que tiene reservadas CSS para background-position
(left|center|right y/o top|center|bottom). si indicas valores en medidas o
en porcentajes, el primero es vertical y el segundo horizontal (creo, no
estoy seguro), pero si usas las palabras reservadas da igual cómo los
combines.
además puedes fijarla al lienzo, que suele quedar bastante chulo cuando el
div tiene barra de deslizamiento (background-attachment).
por tanto hay varias propiedades:
background-color: para dar color
background-image: para indicar la imagen con el formato
url('<path_de_la_imagen')
background-repeat: repeat (para todo el lienzo), no-repeat (para que no
repita, solo aparece una vez), repeat-y (se repite verticalmente), repeat-x
(se repite horizontalmente)
background-position: posiciona la primera aparición de la imagen, y no pones
no-repeat en la prop anterior, aparece una sola vez en la posición que le
indiques, pero si tiene repetición te aparecerá en esa posición y a partir
de ahí se repite horizontal y/o verticalmente
background-attachment: scroll (para que se deslize cuando muevas el scroll y
se mueva con el contenido) o fixed (para que siempre permanezca en la misma
posición y el contenido se deslice sobre la imagen)
todo esto lo puedes meter en una misma propiedad, la llamada propiedad
resumen de fondos:
background: puedes meter solo un color, solo una imagen o ambos. recuerda
que si no metes imagen al fondo, ni el control de repetición, ni de
posición, ni de "fijación" al lienzo sirven, porque no tienen una imagn
sobre la cuál aplicarse.
ejemplos:
-solo un color:
div#div1 { background-color: red; }
-solo una imagen sin más controles:
div#div1 { background-image: url('./imgs/fondo.png'); }
-combinar los dos:
div#div1 { background-color: red;
background-image: url('./imgs/fondo.png'); }
o
div#div1 { background: red url('./imgs/fondo.png'); }
-combinar todo:
div#div1 { background-color: red;
background-image: url('./imgs/fondo.png');
background-repeat: repeat-y;
background-position: bottom left;
background-attachment: fixed; }
o
div#div1 { background: red url('./imgs/fondo.png') repeat-y bottom left
fixed; }
----- Original Message -----
From: "Pixelperu" <[EMAIL PROTECTED]>
To: "Ovillo" <Ovillo@ovillo.org>
Sent: Tuesday, March 29, 2005 2:32 AM
Subject: [Ovillo] Background en div
Hola a todos..
alguien me podría echar una mano sobre como colocar un background en un div?
Gracias,
--------------------------------------------------
Miguel Flores Franco - Pixelperu
Arte - Diseño - Web - Fotografía Digital - Hosting
http://www.pixelperu.com • http://www.pixelperu.net
MSN: [EMAIL PROTECTED]
----------------------------------------------------------------------------
----
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
