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.

Imágenes responsivas dentro de un documento HTML con CSS

Imágenes responsivas dentro de un documento HTML con CSS

Del curso: CSS: Diseño web responsive

Comenzar mi mes de prueba gratis Comprar para mi equipo

Imágenes responsivas dentro de un documento HTML con CSS

“

En este vídeo vamos a ver cómo trabajar con las imágenes cuando estamos trabajando en un diseño "responsive". Como podemos ver, tenemos por un lado el HTML con las CSS implementadas, renderizado en nuestro navegador y, por otro lado, tenemos nuestro diseño. Lo primero que haremos será evaluar que las imágenes que tenemos para escritorio, el tamaño que tienen y qué tamaño tienen para dispositivo móvil. en este caso para nuestro iPad es del mismo tamaño pero, si nos vamos a dispositivo móvil, como podemos ver, es más pequeña. ¿Cómo trabajaremos con las imágenes cuando estas son para "responsive"? Si aquí eligiéramos móvil, al 100 %, como vemos nuestra imagen siempre tiene el mismo tamaño. La manera de trabajar con imágenes en "responsive" es siempre haciendo que la imagen tenga un tamaño en porcentajes. Es decir, que lo que haremos será decirle que la imagen, como máximo, tenga el 100 % del ancho. De esta manera, nunca se nos va a salir del tamaño de pantalla. Y que su ancho sea del 100…

Contenido