Como posicionar fondo de pagina?

Diego_Bolivar · #1 (**permalink**) 03/02/2008, 14:26

Buenas, primero que todo saludos a todos los usuarios de este foro que es uno de los mejores...

bueno, mi problema es el siguiente, no se como posicionar (por decirlo asi) un fondo de pagina, lo que quiero es que la pagina tenga como borde unas estrellas, ya sea mediante tablas o mediante css, y que no importe la resolucion del visitante y/o el explorador que use... lo que quiero seria algo asi:

Gracias de antemano a los interesados en ayudarme a solucionar este inconveniente, mas adelante les devolvere el favor porque estare muy pendiente del foro, saludos!

[HH]KaoS · #2 (**permalink**) 03/02/2008, 15:03

Diego, ¿quieres que los bordes esten al 100% tanto de ancho como de alto?
Si es así creo que más apropiado será que te aconsejen los del foro de CSS ya que es la única forma de conseguirlo.

Pero bueno, quedo a la espera de tu respuesta.
Un saludo

Diego_Bolivar · #3 (**permalink**) 03/02/2008, 15:32

Hola, gracias por tu respuesta

pues me gustaria que las estrellas queden con 5px o algo asi de distancia del borde de la pagina, pero si la unica forma es que queden pegadas igual aceptaria un consejo =/... la idea me gusta mucho porque es para el website de un hotel.

saludos

kahlito · #4 (**permalink**) 05/02/2008, 08:47

Hola Diego_Bolivar.

Una opción que se me ocurre es crear un fondo .jgp, .gif, o .png a unos 5px de distancia con los bordes y luego la utilizas como fondo redimensionable en tu diseño. Mira por ejemplo aquí:

http://www.cssplay.co.uk/layouts/background.html

Por ejemplo te puede valer esta parte:

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prueba de fondo redimensionable al 100%</title>
<style type="text/css">
html, body {margin:0; padding:0; width:100%; height:100%; overflow:hidden;}
#background{position:absolute; z-index:-1; width:100%; height:100%;}
</style>
</head>

<body>
<img id="background" src="rabbit.jpg" alt="" title="" />
<p>Aquí metes todo el contenido que quieras</p>
</body>
</html>