Curso de Responsive Design 2016

Toma las primeras clases gratis

Quería que al reducir la pantalla la imagen que habia diseñado para desktop se cambiara a una más pequeña que diseñe para tabletas, pero no encontraba la forma de hacerlo.

Cuando queremos cambiar una imagen pero mantener todos los estilos que tenia antes de cambiar, podemos usar esta herramienta.

En la web hay muchos ejemplos de como hacerlo si es una imagen de fondo, pero no encontré ejemplos de como hacerlo si es una “img” de html

Usando “content” nos solucionamos el problema:

<img class="portada"/> <!-- la imagen en el html !-->

<!-- en css !-->
@media screen and (max-width: 800px) {
.portada img {
    content:url("imagennueva.jpg");
}
}```

Me pareció muy útil, espero le sirva a alguien. 

Curso de Responsive Design 2016

Toma las primeras clases gratis

0 Comentarios

para escribir tu comentario

Artículos relacionados