Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS colour lens for images

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #38242
    magician11
    Participant

    Hi there,

    I have a series of images, and I want them to all look like as if I am viewing them through coloured glasses. They are all different colours, and I want them all to look a particular shade of green. Maybe something to do with opacity?

    .menuIcons {

    ..?
    }

    thanks.

    #103567
    Mottie
    Member

    I think the easiest option would be to make the images have some transparency over a colored background. Something like this (demo):

    CSS

    li {
    background: #0f0;
    display: inline-block;
    width: 100px;
    height: 100px;
    }
    li img {
    opacity: 0.8;
    filter: alpha(opacity=80);
    }
    ‚Äč

    HTML





    #103588
    magician11
    Participant

    That does work brilliantly. However, when I applied it to my images (which are little icons with transparent backgrounds over a white background — view it here) I see a green background around them.

    I guess I realise now that I just want the images themselves to move towards a shade of green. Your code works great for completely square/rectangle images. So maybe something for an image program like The Gimp instead?

    Also for my education, what is the difference between these two lines?

        opacity: 0.8;
    filter: alpha(opacity=80);

    thank you for your solution!

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.