CSS Image Opacity/Transparency
Note: There is no CSS standard. However, engineering all modern browsers is part of W3C CSS 3 recommendations.
Example 1-create a transparent image
First, we will show you how to create a transparent image CSS.
Regular image:
For example, 2-image transparency-influence of mouse placement
We can see that the source code of the first line is similar to source code example 1. In addition, we have added an onmouseover attribute and an onmouseout attribute.
The image of the mouse pointer moving when the onmouseover attribute is defined. In this case, the image we want cannot be transparent when we move the mouse pointer over it.
In Firefox: this. style. opacity = 1 and IE, the syntax is: this. filters. alpha. opacity = 100.
When the mouse pointer is far away from the image, we want the image to be transparent once. This is done in the onmouseout attribute.<Html><Body><Div class = "background"> <div class = "transbox"> <p> This is some text that is placed in the transparent box. this is some text that is placed in the transparent box. this is some text that is placed in the transparent box. this is some text that is placed in the transparent box. this is some text that is placed in the transparent box.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
