Transparent Objects

Applying Transparency to Objects

We talked about applying a transparent-translucent background color in the previous thread. On this page, we will talk about applying transparency to objects (images, text, etc.).

By using the opacity property, the transparency value of the desired html elements can be determined. A value between 0 and 1 sets how transparent objects appear.

In some older browsers, it is necessary to use filter: alpha(opacity=?) instead of opacity. ? instead, a value between 0 and 100 is given.

give transparency with css

While the opacity property of the above picture is 0.3, it is made to be fully visible by making it 1 when hovered over it.

.image1{
opacity:  0.3;
filter:alpha(opacity=30);}
 
.image1:hover{
opacity: 1;
filter: alpha(opacity=100);}

 

css opacity, apply transparency to images, hover image to be transparent, set transparency using css opacity property

EXERCISES

There are no examples related to this subject.



COMMENTS




Read 772 times.

Online Users: 189



css-transparent-objects