Estilosccs2

21
Propiedades del fondo

Transcript of Estilosccs2

Page 1: Estilosccs2

Propiedades del fondo

Page 2: Estilosccs2

Establece el color de fondo de un

elemento. El fondo se extiende al borde

del elemento. Valor inicial: transparente.

{ background-color: #CCCC00 }

Page 3: Estilosccs2

En la ventada del css se modifica sin tener que ocupar la barra de propiedades ( se añade propiedad

Page 4: Estilosccs2

Se selecciona el formato de fondo color

Page 5: Estilosccs2

Aquí se selecciona el color

Page 6: Estilosccs2

Así queda con el formato aplicado

Page 7: Estilosccs2

Define una imagen como patrón de fondo. En conjunción con las otras propiedades de fondo, puede usarse como mosaico o repetirse en una direccción solamente. De uso recomendado con background-color, para las personas que deshabilitan la carga de imágenes.

BODY {background-image: url(bg41.gif);}

Page 8: Estilosccs2

Se añade la imagen

Page 9: Estilosccs2

Se selecciona el archivo deseado

Page 10: Estilosccs2

Así queda con la imagen no repeat

Page 11: Estilosccs2

Establede el estilo de repeticion para

una imagen de fondo. Los valores son:

repeat (mosaico), no-repeat, repeat-x

(horizontal), repeat-y (vertical). Por

defecto: repeat.

BODY { background-repeat: repeat-y }

Page 12: Estilosccs2

Se seleciona al costado repeat

Page 13: Estilosccs2

Vista de la imagen repeat ( es decir repetida )

Page 14: Estilosccs2

Define si la imagen de fondo sigue el

movimiento de desplazamiento de la

barra de scroll o si no. Los valores

posibles son: scroll y fixed.

BODY {background-attachment: fixed;}

Page 15: Estilosccs2

Se agrega attachment para dejar la imagen quieta en el formato

Page 16: Estilosccs2

Fixed= la imagen se queda quieta en el fondoScroll= la imagen se mueve en conjunto con la barra

Page 17: Estilosccs2

Establece el punto de comienzo de un

fondo, ya sea imagen o color. Si es un

color, el relleno del color continua desde

tal posición. Si es una imagen, la primera

imagen es ubicada en esa posición.

Valores: Position (x y) o (x% y%);

top, center, bottom, left, right.

BODY {background-position: top center;}

Page 18: Estilosccs2

Se selecciona la posición de la imagen de fondo ya sea horizontal, vertical, centrada

Page 19: Estilosccs2

Imagen con aplicación del formato deseado

Page 20: Estilosccs2

Abreviatura para las demás

propiedades. Los valores pueden ser

escritos en cualquier orden.

BODY {;} background: white url(bg41.gif)

fixed center

Page 21: Estilosccs2

Se puede escribir como se desee, el orden de los factores no altera el producto