Transparancy on Image with css

Hi,

I'd like to add transparency to an image. You can see an example of what I want to achieve in the attached image.

I know how to do this if I use a <div> and add the image as a background and apply rgba effect on it, but is it possible to get a similar effect with a usual image <img src---->"? If so how can I do it?

Peter

CSSJavaScriptjQuery

Last Comment

lenamtl

8/22/2022 - Mon

Chris Stanyon

3/31/2015

You can do it as part of the image, but you'd need to use an image editing package to add the overlay - something like Photoshop or Gimp.

You could also probably do it with a server-side script such as PHP, but it's not the easiest.

By far the easiest way is to overlay a div over an image. Is there a particular reason you don't want to do that?

SOLUTION

Robert Granlund

4/1/2015

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.

View this solution by signing up for a free trial.

Members can start a 7-Day free trial and enjoy unlimited access to the platform.

See Pricing Options

Start Free Trial

GET A PERSONALIZED SOLUTION

Ask your own question & get feedback from real experts

Find out why thousands trust the EE community with their toughest problems.

ASKER CERTIFIED SOLUTION