Hacer un background de fondo que no se mueva

jjrolevio · #1 (**permalink**) 10/12/2008, 04:05

Muy buenas a todos, me gustaría saber si es posible hacer un background de fondo de web con una imagen, o sea poniéndolo en la etiqueta body, y que no se mueva aunque vallas hacia arriba o hacia abajo con la barra de desplazamiento general, o sea solo se movería el contenido de la web pero no el fondo.

Lo he visto alguna vez en meristation.com pero no se si la web esta hecha con frames, que creo que no.

Espero me podáis decir si se puede o no.
Saludos y gracias anticipadas.

Ferri · #2 (**permalink**) 10/12/2008, 04:13

no te refieres al tipico

<body background="xxxx.jpg"> ? nose si es asi xD no te acabo de entender

seoista · #3 (**permalink**) 10/12/2008, 06:18

Para que el fondo quede fijo:

Código html:

Ver original<head>
<style type="text/css">
body {
background: url (tu-imagen.jpg);
background-attachment: fixed;
}
</style>
</head>

Saludos

codig0 · #4 (**permalink**) 10/12/2008, 07:21

Código:

<style type="text/css">
body {
background:url(imagen.jpg) fixed;
}
</style>

kmzero · #5 (**permalink**) 10/12/2008, 12:14

muchas gracias por el aporte colateral! He estado combinando imágenes para que al bajar se continúe la estética. Este es un gran adelanto!! saludos

kmzero · #6 (**permalink**) 10/12/2008, 12:21

Cita:

Iniciado por jjrolevio

Muy buenas a todos, me gustaría saber si es posible hacer un background de fondo de web con una imagen, o sea poniéndolo en la etiqueta body, y que no se mueva aunque vallas hacia arriba o hacia abajo con la barra de desplazamiento general, o sea solo se movería el contenido de la web pero no el fondo.

Lo he visto alguna vez en meristation.com pero no se si la web esta hecha con frames, que creo que no.

Espero me podáis decir si se puede o no.
Saludos y gracias anticipadas.

Teniendo en cuenta la mágica solución me animo a preguntar por este otro capricho de diseño que tengo:
quiero lograr que mis tablas de contenido "transparenten" el background del body, al estilo myspace.live.com ¿Saben a qué me refiero?
Es posible?? cómo se logra?

gracias!!

Null_ · #7 (**permalink**) 11/12/2008, 09:11

Además:
puedes complementar con mas propiedades, por ejemplo la posición y la repetición del fondo de esta manera:

Código HTML:

<head>
      <style type="text/css">
      body {
      background-image: url (tu-imagen.jpg);
      background-attachment: fixed;
      background-posicion:left top;
      background-repeat:repeat-x;
      }
      </style>
</head>

En este caso que se definen todas las propiedades puedes escribirlo de forma abreviada y tambien agregar un color de fondo complementario a la imagen:

Código HTML:

<head>
      <style type="text/css">
      body {
      background:url('imagen.png') left top repeat-x fixed #C00;
      }
      </style>
</head>

Aqui te dejo los valores que puedes utilizar en la propiedad background:

fijacion del fondo: scroll, fixed
posiciones horizontales: left, right, center
posiciones verticales: top, bottom, center
repeticion de imagen: repeat, no-repeat, repeat-x, repeat-y
color de fondo: #000, #000000, rgb(256,256,256), rgb(100%,100%,100%), transparent, color en ingles
imagen de fondo: url('direccion-de-da-imagen.png')

Otra cosa es que hay una tecnica que consiste en aplicar un div despues del body, y a este div le agregamos propiedades de fondo diferentes a la de body (con color transparente) para obtener un fondo con doble imagen...

Suerte

kmzero · #8 (**permalink**) 05/02/2009, 14:10

mmmm.... aún no logro el resultado......
qué tal si lo que quiero es que la tabla tenga un fondo semi transparente que trasluzca el fondo del body?????
qué se les ocurre?
lo mismo funcionaría?
pruebo y les cuento

ElJavista · #9 (**permalink**) 06/02/2009, 10:15

Semitranparente? claro, no hay problema, a la tabla agregale este estilo:

<table style="background-color: #CCCCCC; filter: alpha(opacity = 50); opacity: 0.5">

Obivamente los colores y los valores son ejemplos. Espero que te sirva.