Paginas web

Páginas: 28 (6850 palabras) Publicado: 19 de marzo de 2012
PROPIEDADES CSS
Background Image (Imagen de fondo)
Sintaxis: | background-image: <valor> |
Valores posibles: | <url> | none |
Valor inicial: | none |
Se aplica a: | Todos los elementos |
Heredado: | No |
La propiedad background-image establece la imagen de fondo de un elemento. Por ejemplo:
BODY { background-image: url(/images/foo.gif) }
P { background-image:url(http://www.htmlhelp.com/bg.png) }
Cuando se define una imagen de fondo (background image), también debería definirse un background color (color de fondo) similar para aquellos que no cargan las imágenes.
Los autores también pueden usar la forma rápida de la propiedad background, que está mejor soportada que la propiedad background-image.

Background Repeat (Repetir fondo)
Sintaxis: |background-repeat: <valor> |
Valores posibles: | repeat | repeat-x | repeat-y | no-repeat |
Valor inicial: | repeat |
Se aplica a: | Todos los elementos |
Heredado: | No |
La propiedad background-repeat determina como se repite la background image (imagen de fondo) especificada. El valor repeat-x repetirá la imagen horizontalmente mientras que el valor repeat-y repetirá la imagenverticalmente. Por ejemplo:
BODY { background: white url(candybar.gif);
background-repeat: repeat-x }
En el ejemplo de arriba, la imagen solo será organizada en mosaico horizontal.
Los autores también pueden usar la foma rápida de la propiedad background, que está mejor soportada que la propiedad background-repeat.

Background Attachment (Fijación de fondo)
Sintaxis: | background-attachment:<valor> |
Valores posibles: | scroll | fixed |
Valor inicial: | scroll |
Se aplica a: | Todos los elementos |
Heredado: | No |
La propiedad background-attachment determina si la background image (imagen de fondo) especificada se desplazará con el contenido o será fija con respecto al lienzo. Por ejemplo, la línea siguiente especifica una imagen de fondo fija:
BODY { background: whiteurl(candybar.gif);
background-attachment: fixed }
Los autores también pueden usar la forma rápida de la propiedad background, que está mejor soportada que la propiedad background-attachment.

Background Position (Posición del fondo)
Sintaxis: | background-position: <valor> |
Valores posibles: | [<porcentaje> | <longitud>]{1,2} | [top | center | bottom] || [left |center | right] |
Valor inicial: | 0% 0% |
Se aplica a: | Elementos de nivel bloque y elementos reemplazados |
Heredado: | No |
La propiedad background-position da la posición inicial de la background image (imagen de fondo) especificada. Esta propiedad solo puede aplicarse a elementos de nivel bloque y a elementos reemplazados. (Un elemento reemplazado es aquel del que solo se conocen lasdimensiones intrínsecas; los elementos reemplazados HTML incluyen IMG, INPUT,TEXTAREA, SELECT, y OBJECT.)
La forma más sencilla de asignar una ubicación de fondo es con palabras clave:
* Palabras clave horizontales (left, center, right)
* Palabras clave horizontales verticales (top, center, bottom)
También pueden usarse porcentajes y longitudes para asignar la posición de la imagen defondo. Los porcentajes son relativos al tamaño del elemento. Aunque se permiten longitudes, no se recomiendan debido a su inherente debilidad al tratar con diferentes resoluciones de pantalla.
Al usar porcentajes o longitudes, la posición horizontal se especifica primero, seguida de la posición vertical. Un valor como 20% 65% especifica que la imagen se colocará 20% a la derecha y 65% abajo delelemento. Un valor como 5px 10px especifica que la esquina superior izquierda de la imagen se colocará 5 pixels a la derecha y 10 pixels abajo de la esquina superior izquierda del elemento.
Si solo se da el valor horizontal, la posición vertical será 50%. Se permiten combinaciones de longitudes y porcentajes, ya que son posiciones negativas. Por ejemplo, 10% -2cm está permitido. Sin embargo,...
Leer documento completo

Regístrate para leer el documento completo.

Estos documentos también te pueden resultar útiles

  • Pagina web
  • Paginas Web
  • Paginas Web
  • pagina web
  • Página web
  • Paginas Web
  • Paginas Web
  • paginas web

Conviértase en miembro formal de Buenas Tareas

INSCRÍBETE - ES GRATIS