Cómo aplicar degradado lineal en la imagen usando viento de cola,
Probé dos versiones de este código pero no funciona
Este no funciona:
<div> <img src={BannerImage} alt="BannerImage" className="h-[70vh] lg:h-[80vh] w-full object-cover object-right bg-gradient-to-r from-cyan-500 to-blue-500" /> </div>Este tampoco funciona:
<div className="bg-gradient-to-r from-cyan-500 to-blue-500"> <img src={BannerImage} alt="BannerImage" className="h-[70vh] lg:h-[80vh] w-full object-cover object-right" /> </div>Lo más cerca que puedo lograr es esto,
<div class="relative"> <img src="http://codeskulptor-demos.commondatastorage.googleapis.com/GalaxyInvaders/back05.jpg" alt="BannerImage" class="absolute h-[70vh] lg:h-[80vh] w-full object-cover object-right opacity-30 " /> <div class="absolute -z-10 bg-gradient-to-t from-white via-black to-black h-[70vh] lg:h-[80vh] w-full" /> </div>Consulte este https://play.tailwindcss.com/fq9cdlFfCt