ubiquitour.com

Cómo hacer diferentes tamaños de pantalla un ajuste de página Web en el CSS

Sitios web puede verse en el monitor diferentes dimensiones y dispositivos móviles, por lo que usted quiere hacer su página Web caben tantos tamaños de pantalla como sea posible. Al código de su sitio, se fijan las medidas de la página por defecto: el visitante ve la misma pantalla pase lo que pase. Usando hojas de estilo en cascada o CSS, puede establecer el ancho de página a un porcentaje así que el documento es flexible cuando un espectador ajusta su ventana del navegador.

Instrucciones

1 Inicie el software de editor de texto y abra el documento de página web que se está modificando. Escriba este código CSS entre la cabeza del < >< / cabeza > elementos:

< estilo tipo = "text/css" >

< / estilo >

2 Escriba "#content {}" entre las etiquetas de estilo para crear una regla que regula el área de contenido principal de su página.

3 Tipo "anchura:;" dentro de las llaves y entrar en "100%" después de los dos puntos. Acabado código CSS parece ahora el siguiente ejemplo:

< estilo tipo = "text/css" >

contenido {width: 100%;} < / estilo >

4 Posicione el cursor en cualquier lugar por debajo de la etiqueta de apertura < cuerpo > donde usted desea el texto a mostrar. Escriba "< div id ="contenido">< / div >" y escriba el contenido del sitio web entre los elementos div. Por ejemplo:

< div id = "contenido" >

Este es el contenido de su página Web.

< / div >

5 Guarde su documento y escuchar su trabajo en una ventana del navegador. Sube tu archivo a tu cuenta de propietario de la Web para publicar la Página actualizada.

Consejos y advertencias

  • Si tienes otro elemento de la página, como una barra de navegación, establezca el ancho en porcentaje para que también escala en una ventana del navegador. El total de todos los elementos no debe exceder 100 por ciento. Por ejemplo:
  • #nav {width: 25%;}
  • #content {width: 75%;}