Poner web encima de un fondo

dimoca · #1 (**permalink**) 23/05/2010, 12:40

Hola mi problema es muy sencillo, quisiera que mi web se quedara de forma que tenga un fondo y encima de ese fondo este una web (un rss) centrado y en la posicion que yo quiero. Me podrian decir un codigo o algo. Gracias

millan2525 · #2 (**permalink**) 23/05/2010, 15:35

Podrias hacer un div centrado del tamaño que quieras, como tu quieras y fuera de este poner el fondo, y dentro, el contenido

webmetrics · #3 (**permalink**) 24/05/2010, 08:51

Como bien dice millan2525, tendrias que crearte un div con su imagen de fondo.

A ese div "content" darle el ancho de la web y poner las propiedades margin-right y margin-left a "auto" para que se centre con cualquier pantalla.

Despues dentro de este div meter todo el contenido de la web. Así te quedará todo centrado con el tamaño que necesites.

nicosli · #4 (**permalink**) 24/05/2010, 11:43

Cita:

Iniciado por dimoca

Hola mi problema es muy sencillo, quisiera que mi web se quedara de forma que tenga un fondo y encima de ese fondo este una web (un rss) centrado y en la posicion que yo quiero. Me podrian decir un codigo o algo. Gracias

el html

Código:

<html>

<head>
  <link href='estilo.css' type='text/css' />
</head>

<body>

<div id="contenedor">
  ...aqui la pagina
</div>

</body>

</html>

el css

Código:

body{
  margin:0;
  padding:0;
  background: url(fondo.jpg);
}

#contenedor{
  width:900px;
  height:auto;
  margin:0 auto;
}

margin:0 auto; hace que se centre el div

Para poder acomodar el fondo de la pagina puedes jugar con las siguientes opciones:
'center' lo va a poner en el centro de la pagina
'bottom' lo va a acomodar siempre debajo de la pagina (dependiendo del alto)
'repet-x' lo repite en x
'repet-y' lo repite en y

por ejemplo:

Código:

body{
  margin:0;
  padding:0;
  background: url(fondo.jpg) center;
}

espero que hay sido claro.

reyvolsam · #5 (**permalink**) 26/05/2010, 16:38

Cita:

Iniciado por nicosli

el html

Código:

<html>

<head>
  <link href='estilo.css' type='text/css' />
</head>

<body>

<div id="contenedor">
  ...aqui la pagina
</div>

</body>

</html>

el css

Código:

body{
  margin:0;
  padding:0;
  background: url(fondo.jpg);
}

#contenedor{
  width:900px;
  height:auto;
  margin:0 auto;
}

margin:0 auto; hace que se centre el div

Para poder acomodar el fondo de la pagina puedes jugar con las siguientes opciones:
'center' lo va a poner en el centro de la pagina
'bottom' lo va a acomodar siempre debajo de la pagina (dependiendo del alto)
'repet-x' lo repite en x
'repet-y' lo repite en y

por ejemplo:

Código:

body{
  margin:0;
  padding:0;
  background: url(fondo.jpg) center;
}

espero que hay sido claro.

Como dice @nicosli, creo que daria bienn..

dimoca · #6 (**permalink**) 14/02/2012, 10:29

Graciaaas!

Perry0511 · #7 (**permalink**) 15/02/2012, 09:05

Por si te sirve como mejor del diseño (desconozco tu propósito), puedes user:

background-attachment:fixed;

para hacer que la imagen de fondo sea fija, y no se desplace al hacer scroll.