View code
| The code is as follows: |
Copy code |
<Div class = "top"> <div class = "sub"> css opacity attribute! </Div>
|
In the above structure, if you set the top opacity attribute to achieve the transparent effect, you will find that all the elements in it inherit the transparent effect, which obviously cannot meet the requirements. At least the font must be clear.
Collected related knowledge points from the internet
First, the standard css transparent writing is provided, which is compatible with most browsers.
| The code is as follows: |
Copy code |
. Top {filter: alpha (opacity = 50);-moz-opacity: 0.5;-khtml-opacity: 0.5; opacity: 0.5 ;}
|
The preceding attributes are as follows:
Opacity: 0.5; this is the most important because it is the CSS standard. This attribute supports Firefox, Safari, and Opera.
Filter: alpha (opacity = 50); this is set for IE6, the value can be 0-100, and the other three 0 to 1.
-Moz-opacity: 0.5; to support earlier Mozilla browsers.
-Khtml-opacity: 0.5; to support some older versions of Safari browsers.
The above example involves the inheritance of transparent attributes.