1. ¿Buscando un Banco para abrir tu primera cuenta de ahorros? Revisa nuestro comparativo de cuentas cero mantenimiento haciendo clic aquí.
    Ocultar anuncio

¿Cómo hacer para que mi página se vea en 100%?

Publicado en 'Webmasters' por maciel, 2 Ene 2009.





  1. maciel

    maciel Miembro nuevo

    Registro:
    16 Dic 2008
    Mensajes:
    15
    Likes:
    0




    hola a todos, necesito ayuda de webmasters para una pagina.:unsure:
    mi pregunta es la siguiente:
    cuando hago la plantilla de mi pagina,quiero se adapte a cualquier monitor, osea cuando se ve en un monitor pekeño, se expande en toda la pantalla y cuando la veo en una pantalla mas grande se pone como si fuera en un marco.
    lo que quiero es hacer ke mi pagina se vea en 100% , y se adapte en cualkier monitor sea grande o pekeño
     
    Editado por el moderador: 6 Ene 2009


  2. Roydan

    Roydan Miembro maestro

    Registro:
    5 Jun 2007
    Mensajes:
    277
    Likes:
    12
    Usa DIVs y ponles como width 100%. procura tambien poner un minimo y un maximo. en google encuentras ejemplos mas detallados seguro.Suerte
     
  3. MijT

    MijT Miembro de bronce

    Registro:
    12 Oct 2006
    Mensajes:
    1,106
    Likes:
    63
    Eso lo solucionas con CSS creando un div que contenga todos los elementos de tu página, de esta forma:

    HTML:
    div#container {
        width: 100%;
    }
    Luego en tu página html creas el div y le asignas la ID "container", de esta forma

    HTML:
    <body>
        <div id="container">
            <!-- Aquí pones los demás elementos de tu página -->
        </div>
    </body>
    Con eso podrás adaptar tu página a cualquier resolución.

    Saludos.
     
  4. maciel

    maciel Miembro nuevo

    Registro:
    16 Dic 2008
    Mensajes:
    15
    Likes:
    0
    GRACIAS A LOS DOS :yay:,ME SIRVIO DE MUCHO
    gracias !!!! besos cuidense
     
  5. juniors

    juniors Miembro nuevo

    Registro:
    23 Dic 2008
    Mensajes:
    26
    Likes:
    0
    pues maximizala
    jajajajajaja!
     
  6. kreepa

    kreepa Suspendido

    Registro:
    31 Ene 2009
    Mensajes:
    32
    Likes:
    0
    la pregunta del user de arribita mio es la mas inteligente jajajaj :D
     
  7. FRESKOCHO

    FRESKOCHO Miembro nuevo

    Registro:
    14 Ene 2011
    Mensajes:
    1
    Likes:
    0
    HOLA PUES RESULTA Q SOY NUEVO Y ME GUSTARIA Q MIJT ME EXPLICARA UN POQUITO MAS DETALLADO ACERCA DE LO DE:

    Eso lo solucionas con CSS creando un div que contenga todos los elementos de tu página, de esta forma:


    Código HTML:
    div#container { width: 100%;}
    Luego en tu página html creas el div y le asignas la ID "container", de esta forma


    Código HTML:
    <body> <div id="container"> <!-- Aquí pones los demás elementos de tu página --> </div></body>
    Con eso podrás adaptar tu página a cualquier resolución.


    SI SE PUDIERA PASO POR PASO ESTARIA SUPER MAS Q NADA CON LO PRIMERO EN DONDE SE PONEN Y ESAS COSAS Y YA APROVECHANDO SI ME PUDIERA DECIR CUAL ES EL CODIGODE ARBOL EN HTML Y DE IGUAL MANERA DETALLARLO PASO POR PASO Y EN DONDE LOS PONGO GRACIAS Y ESPERO LA RESPUESTA SALUDOS
     
  8. MijT

    MijT Miembro de bronce

    Registro:
    12 Oct 2006
    Mensajes:
    1,106
    Likes:
    63
    Pero si ahí estoy dando un ejemplo bastante endentible mi estimado :), pero veamos lo el "html completo" para que lo entiendas mejor:

    HTML:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    	/* Contenedor ajustado al ancho del monitor */
    	div#container {
    		width: 100%;
    	}
    </style>
    </head>
    <body>
    <div id="container">
        <!-- Aquí pones los demás elementos de tu página, por ejemplo: -->
        <h1>¡¡HOLA MUNDO!!</h1>
        <p>Esta página está ajustada a cualquier resolución de monitores!!</p>
    </div>
    </body>
    </html>
    Creo que con eso tus dudas quedarán más claras :yeah:

    Saludos.
     
  9. jalex

    jalex Miembro nuevo

    Registro:
    19 Nov 2008
    Mensajes:
    32
    Likes:
    0
    A esto se le conoce como diseño fluído (fluid design), se trata de usar generalmente porcentajes para indicar el tamaño de la caja y em's para las fuentes.

    Quisiera aclarar que no es necesario colocar div#container sino sólo #container, puesto que ya no hay algo más específico que un ID. Para las clases sí se podría hacer, div.clase es distinto a h1.clase.
    Ah y se ve mejor si usamos sólo el 85 o 90% de la pantalla ;)
     
    Última edición: 16 Ene 2011