Trucazo de CSS gradiente transparente en imágenes
Trucazo de CSS para crear un degradado a transparente de tus imágenes.
Es muy sencillo, lo puedes lograr en un par de líneas, y además tiene un soporte de casi el 100% de los navegadores actuales.
Tienes que usar la propiedad mask-image, que te permite aplicar una máscara a la imagen. Y para el degradado, puedes usar un gradiente lineal.
También podrías usar gradientes radiales o incluso una imagen como máscara, pero en este caso ya nos va bien con un gradiente lineal.
¿Y por qué no hacer esto en la propia imagen? Pues porque haría que la imagen original pesase más, ya que los gradientes en las imágenes tienen un peso considerable por la opacidad.
Además así puedes cambiar fácilmente desde CSS el efecto y ver cómo queda.
¿Qué te parece? ¿Te lo sabías? ¿Lo usarás en tus proyectos?
#css #css3 #programacion #uxui #desarrolloweb #short
Смотрите видео Trucazo de CSS gradiente transparente en imágenes онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь midudev 17 Июль 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 28,458 раз и оно понравилось 3.2 тысяч людям.