👨‍💻 Agrandar imagen

Para agrandar la imagen,.. clic ACÁ

El código es:

<style> .destacada img{ width: 100px; height: 100px; transform: scale(.5); /*Esto significa que por defecto estara a la mitad del tamaño*/ transition: all ease .1s; } .contenido.text-center h1:hover ~ img{ transform: scale(1); /*Esto para recuperar el tamaño original*/ } /*Abajo los estilos para cambiar el orden de los elementos*/ .contenido.text-center{ display: flex; flex-direction: column; } .contenido.text-center *{ order: 1; } .contenido.text-center h1{ width: 100%; order: 2; } </style> <section class="destacada"> <div class="pattern"></div> <div class="contenido text-center"> <h1 class="estilo"> Para agrandar la imagen,.. clic ACÁ</h1> <img src="URL de la imagen"/> </div> </section>
https://es.stackoverflow.com/questions/195072/hacer-hover-a-un-elemento-y-afectar-a-otro