Programación Web y Scripting > HTML
Adaptar Un Fondo
manurodri189:
--- Cita de: "Angel_K_ido" --- Si, por defecto una imágen de fondo se repite hasta completar la pantalla.
Para que no se repita puedes usar CSS:
--- Código: Text ---<html> <head> <style type="text/css"> body {background-image: url(Fondo.gif); background-repeat: no-repeat} </style> </head> <body> </body></html>
Pero de esta manera no se cubre toda la pantalla.
Para centrar la imagen en vez de insertar la imágen en el body lo deberías hacer en un div.
------------------------------------------------------------------------------------------------
Yo no se utilizar capas ni se si todos los navegadores las soportan pero haciendo uso de estas supongo que podrías insertar una imágen en una capa y utilizar las propiedades width=100% y height=100% para estirarla a toda la pantalla sin importar la resolución del monitor.
--- Fin de la cita ---
Esto no me funciona, no se si estara algo mal pero no me va
manurodri189:
--- Cita de: "ArKaNtOs" --- o puedes realizar esto
<style type="text/css">
body { background: #f0f0f0 url(Fondo.gif) center center no-repeat; }
/* con esto estableces un color de fondo para los lados de la imagen ya que esta estara centrada */
</style>
mas información sobre background:
http://www.w3schools.com/css/css_background.asp
--- Fin de la cita ---
Esto si me funciona, el problema ya no es solo el fondo, es que al cambiar la configuracion de la pantalla, se me descolocan hasta los botones y demas, sabes como lo puedo solucionar, digamos que esa web adopte la resolucion que tengo?.Salu2
ArKaNtOs:
digamos si estas usando tablas puedes en vez de decir <table width='80%' podrías adaptarlo a cierta cantidad de pixeles digamos <table width='500px' asi aunque cambie de resolución siempre sera lo mismo :) si estas usando div puedes crear un div como contenedor de los demas div ejemplo
[dohtml]
<div align="center" style="background-color: #f0f0f0; border: 3px #000 dashed; width: 500px">
<div style='border: 2px #ff3300 solid; float: left ; width: 145px;' align='center'>menu</div>
<div style='border: 2px #009bf5 solid; margin-left: 150px;' align='center'>texto</div>
</div>
[/dohtml]
codigo:
--- Código: Text --- <div align='center' style='background-color: #f0f0f0; border: 3px #000 dashed; width: 350px'><div style='border: 2px #ff3300 solid; float: left; width: 145px;' align='center'>menu</div><div style='border: 2px #009bf5 solid; margin-left: 150px;' align='center'>texto</div></div> espero algo así te refieras
Mollense:
--- Cita de: "manurodri189" ---
--- Cita de: "Angel_K_ido" --- Si, por defecto una imágen de fondo se repite hasta completar la pantalla.
Para que no se repita puedes usar CSS:
--- Código: Text ---<html> <head> <style type="text/css"> body {background-image: url(Fondo.gif); background-repeat: no-repeat} </style> </head> <body> </body></html>
Pero de esta manera no se cubre toda la pantalla.
Para centrar la imagen en vez de insertar la imágen en el body lo deberías hacer en un div.
------------------------------------------------------------------------------------------------
Yo no se utilizar capas ni se si todos los navegadores las soportan pero haciendo uso de estas supongo que podrías insertar una imágen en una capa y utilizar las propiedades width=100% y height=100% para estirarla a toda la pantalla sin importar la resolución del monitor.
--- Fin de la cita ---
Esto no me funciona, no se si estara algo mal pero no me va
--- Fin de la cita ---
Donde dice Fondo.gif debes poner la url de tu imagen de fondo. Si la imagen se llamara fondo.gif y estuviese en el mismo directorio que tu página entonces el código que te di funcionaría.
manurodri189:
--- Cita de: "ArKaNtOs" --- digamos si estas usando tablas puedes en vez de decir <table width='80%' podrías adaptarlo a cierta cantidad de pixeles digamos <table width='500px' asi aunque cambie de resolución siempre sera lo mismo :) si estas usando div puedes crear un div como contenedor de los demas div ejemplo
[dohtml]
<div align='center' width='350px' style='background-color: #f0f0f0; border: 3px #000 dashed;'>
<div style='border: 2px #ff3300 solid; float: left ; width: 145px;' align='center'>menu</div>
<div style='border: 2px #009bf5 solid; margin-left: 150px;' align='center'>texto</div>
</div>
[/dohtml]
codigo:
--- Código: Text --- <div align='center' width='350px' style='background-color: #f0f0f0; border: 3px #000 dashed;'><div style='border: 2px #ff3300 solid; float: left; width: 145px;' align='center'>menu</div><div style='border: 2px #009bf5 solid; margin-left: 150px;' align='center'>texto</div></div> espero algo así te refieras
--- Fin de la cita ---
No no estoy usando nada de eso.Salu2
Navegación
[#] Página Siguiente
[*] Página Anterior
Ir a la versión completa