Print
Full screen
Share

TUTO Efecto blanco y negro al poner el cursor sobre la imágen

Primer código a copiar en este tutorial:

.bw {-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;-ms-transition: all 1s ease;transition: all 1s ease;}.bw:hover {-webkit-filter: grayscale(100%);}.pic {float: center;margin: 20px;overflow: hidden;}
Segundo código a copiar en este tutorial:
<div class="bw pic"><img src="URL DE TU IMÁGEN" alt="sea"></div>
 
Ojo: Unicamente debes modificar lo que está en amarillo... Tu solo sigue los pasos del tutorial en el blog Confia en Cristo.
Tercer código a copiar si quieres la imagen centrada:
Si quieres que la imagen con este efecto se visualice centrada, como te explico al final del tutorial allá en el blog, entonces utiliza este código:
<center><div class="bw pic"><img src="URL DE TU IMÁGEN" alt="sea"></div></center>
Si quieres la imagen a la derecha o izquierda,
entonces modifica el center en el código anterior
por uno de estos dos siguientes, según sea tu necesidad:
Left - Izquierdo
Right - Derecho
 
By Koko Kawaii and Confía En Cristo © Copyright 2018

Want to create own pages and collaborate?
Start your free account today:
By clicking “Sign up”, you agree to our Terms and Conditions