Foros del Web » Creando para Internet » CSS »

adaptar resolucion de web

Estas en el tema de adaptar resolucion de web en el foro de CSS en Foros del Web. Hola, gracias por leer, verán, no tengo mucho tiempo en el diseño web y quizás por ello a uds les parezca fácil esto pero, me ...
  #1 (permalink)  
Antiguo 28/05/2014, 16:43
 
Fecha de Ingreso: mayo-2014
Mensajes: 15
Antigüedad: 10 años, 6 meses
Puntos: 0
adaptar resolucion de web

Hola, gracias por leer, verán, no tengo mucho tiempo en el diseño web y quizás por ello a uds les parezca fácil esto pero, me han pedido que una landing page, no acomode el texto y las imagenes para que sea responsive, si no que se vea exactamente igual en todos lados, las posiciones, todo, la verdad he estado mirando todo el dia pero no tengo idea de como hacer esto, les daría el código pero bueno, creo que es mejor si me dan una ayuda y yo trato de resolverlo solo.


Gracias :D


No se si sea permitido pasar el enlace de la landing así que por ahora al menos en esta descripción no lo paso.
  #2 (permalink)  
Antiguo 28/05/2014, 17:50
Avatar de herzbazi  
Fecha de Ingreso: febrero-2012
Mensajes: 612
Antigüedad: 12 años, 8 meses
Puntos: 36
Respuesta: adaptar resolucion de web

Cita:
Iniciado por Mauronymus Ver Mensaje
Hola, gracias por leer, verán, no tengo mucho tiempo en el diseño web y quizás por ello a uds les parezca fácil esto pero, me han pedido que una landing page, no acomode el texto y las imagenes para que sea responsive, si no que se vea exactamente igual en todos lados, las posiciones, todo, la verdad he estado mirando todo el dia pero no tengo idea de como hacer esto, les daría el código pero bueno, creo que es mejor si me dan una ayuda y yo trato de resolverlo solo.


Gracias :D


No se si sea permitido pasar el enlace de la landing así que por ahora al menos en esta descripción no lo paso.
pregunto... tu web se ve exactamente igual en un ordenadro que en un movil


ok te digo primero que nada tienes que poner la etiqueta

<meta name="viewport" content="width=device-width, initial-scale=1"> esta etiqueta debe ir dentro del head de tu html
donde declaras el css igual forma

luego de eso pues ya veras que el responsive tiene varios trucos


digamos podrias usar imagenes responsivas de varias formas las mas faciles son

crear un div que encierre la etiqueta img y al la etiqueta ponerle en html un width="100%" y el div colocarlo ya sea en porcentajes o bien en con max-width

la otra es crear un div. con max-width o % y a este ponerle un background de fondo

ambos a medida que se escala el div la imagen lo hace con ello.

lo otro es crear media queris

algo asi


digamos css para monitores de ordenadores
Código CSS:
Ver original
  1. .container-botones{
  2.         width: 240px;
  3.         margin: 0 auto;
  4.     }
css para dispositivos con pantallas de maximo tamaño de 430 px
Código CSS:
Ver original
  1. @media screen and (max-width: 430px) {
  2.     .container-botones{
  3.         width: 240px;
  4.         margin: 0 auto;
  5.     }
  6. }

espero haberte ayudado

nos vemos
si tienes dudas con gusto te ayudo
__________________
Enseña todo lo que sepas...
Aprende todo lo que puedas..

Etiquetas: responsive
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 10:58.