Use CSS to highlight an image?

Question

I have a circle shaped image I want to highlight with red, yellow or green sometimes. Can CSS be used for this?

I know I could do something like border:#CCCCCC thin solid; but I want the highlight to be the same shape as the image (circle in this case).

it definitely can be used. you can use css to create a circle of a certain color to act as a highlight. — J Max
– J Max, Commented Jun 30, 2013 at 4:58

user1693593 · Accepted Answer · 2013-06-30 04:59:59Z

2

Perhaps this helps:

border-radius:50%;
border:#CCCCCC thin solid;

50% border radius makes the border (and its content) round shaped.

answered Jun 30, 2013 at 4:59

user1693593

Sign up to request clarification or add additional context in comments.

Comments

Emad Rahnama · Accepted Answer · 2013-06-30 04:59:16Z

1

maybe help:

box-shadow: 0px 0px 3px blue;

OR

border-radius: 20px;

answered Jun 30, 2013 at 4:59

Emad Rahnama

1,23813 silver badges24 bronze badges

detale · Accepted Answer · 2013-06-30 05:00:41Z

0

If your image is a gif/png with transparent background, setting the opacity will do the trick.

.highlight {
    opacity: 0.7;
}

.highlight:hover {
    opacity: 1;
}

answered Jun 30, 2013 at 5:00

detale

13k6 gold badges44 silver badges43 bronze badges