Del curso: CSS: Diseño web responsive

Accede al curso completo hoy mismo

Únete hoy para acceder a más de 24.100 cursos impartidos por expertos del sector.

Las mediaquery y su implementación en la web responsive

Las mediaquery y su implementación en la web responsive

Del curso: CSS: Diseño web responsive

Las mediaquery y su implementación en la web responsive

En este vídeo vamos a ver cómo generar los estilos correspondientes para conseguir que nuestro diseño de escritorio sea este diseño en dispositivo móvil. Lo primero que vamos a hacer es irnos a nuestro código, irnos a la parte de la "media query" que afecta al dispositivo móvil y empezar a modificar los atributos para que esto que tenemos actualmente, que sería cómo se renderiza la página en móvil, se parezca a esto que tenemos aquí. Lo primero que hacemos es que los elementos ya no están uno al lado de otro, sino que están uno debajo de otro. Para eso vamos a definir, lo primero, sobrescribir el estilo del 'wrapper', que en vez de 900 píxeles queremos que mida el 100 %. Salvamos, nos vamos aquí. Lo siguiente será decirle que nuestra estructura flexible queremos que pase a ser de tipo fila a tipo columna. Él automáticamente en este caso solamente ha colocado el 'about' en tipo columna. Así que vamos a añadir también las otras opciones. Vamos a irnos aquí y añadimos las otras opciones.…

Contenido