Comunidad de diseño web y desarrollo en internet online

Como ajustar tu pagina web a distintas resoluciones

Citar            
MensajeEscrito el 11 Sep 2009 01:18 am
Hola, primero que nada sepan que es mi primer post, sin duda mas de uno ha tenido el problema de la resolución de la pantalla a la hora de visualizar su web, si bien las 'em' o los porcentajes algunas veces funciona, esto seria una solucion incluso mas dinamica.

Experimentando con la pagina, hice algo como esto, cambiar la extencion de css a php e incluir codigo php en mi archivo css y llamarlo como si nada pasara desde el html u otro php, seria algo asi:

Código HTML :

<link rel="stylesheet" href="style.php" type="text/css" />


solo firefox me señala un warning, y lo genial ahora es que podemos enviar variables por GET de la siguennte manera:

Código HTML :

<link rel="stylesheet" href="style.php?var=123" type="text/css" />


pero lo mejor resulta al combinarlo con javascript enviar la el tamaño de la pantalla con algo como esto

Código HTML :

<head>
    <script language = "JavaScript">
       if (screen.width == 800)
          document.write('<link rel="stylesheet" href="site_style.php?width=800" type="text/css" />');
       if (screen.width == 1024)
         document.write('<link rel="stylesheet" href="site_style.php?width=1024" type="text/css" />');
    </script>
</head>


ahora tenemos la variable en nuestro archivo de estilos y podemos escribir el css de acuerdo al tamaño que nos indique javascript, me pareció genial utilizar php de esa manera, espero que les ayude tanto como a mi.

Por quarkmarino

0 de clabLevel



 

chrome
Citar            
MensajeEscrito el 24 Sep 2009 10:54 am
Sin duda funciona para muchos casos, pero esto sólo detecta la resolución de la pantalla, no el tamaño de la ventana donde se abre. No todos los usuarios navegan con el browser maximizado.

Por Freddie

BOFH

53 tutoriales
597 articulos
43 ejemplos

Genero:Masculino   Admin

Conserje de Cristalab

firefox
Citar            
MensajeEscrito el 26 Feb 2011 04:04 pm
Muy buena info, que buena idea!! para la resolucion de la ventana, tambien aplica, ya que eso se define en el archivo css dependiendo de la resolución!!

Por jhonzer

0 de clabLevel



 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.