css - CSS を使用して画像を強調表示しますか?

Question

赤、黄、または緑で強調表示したい円形の画像があります。これにCSSを使用できますか？

次のようなことができることはわかっていますborder:#CCCCCC thin solid;が、ハイライトを画像と同じ形 (この場合は円) にしたいです。

Answer 1

おそらくこれが役立ちます：

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

50% の境界線の半径では、境界線 (およびそのコンテンツ) が丸い形になります。

Answer 2

たぶん助けてください：

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

また

border-radius: 20px;

Answer 3

画像が背景が透明な gif/png の場合は、不透明度を設定するとうまくいきます。

.highlight {
    opacity: 0.7;
}

.highlight:hover {
    opacity: 1;
}