Home > Developer > Web Develop
How CSS sets the div background transparency and is well-compatible:
Recommendation: As far as possible handwriting code, can effectively improve the learning efficiency and depth.
Setting the transparency of objects is useful in many Web page effects, setting the transparency of objects is not difficult, the only difficulty may be how to compatible with the major mainstream browser, the following is a brief introduction to how to achieve this effect. The code example is as follows:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metaname= "Author"content= "http://www.softwhy.com/" /><title>Ant Tribe</title> <styletype= "Text/css"> *{margin:0px;padding:0px; }. Opacity{width:150px;Height:150px;Background-color:Green;Filter:Alpha (OPACITY=50);-moz-opacity:0.5;Opacity:0.5;Margin-left:20px;Margin-top:20px; }span{Display:Block;width:80px;Height:80px; } </style> </Head> <Body> <Divclass= "opacity"> <span>Ant Tribe</span> </Div> </Body> </HTML>
The above code implements the compatibility of each browser. The code for the transparency effect is as follows:
Filter:alpha (OPACITY=50); -moz-opacity:0.5; opacity:0.5;
The first line of code can only be valid in IE browser.
The second line of code supports the old version of the FF browser, which can actually be removed, because the old version of the browser usage rate is very low.
The third line can support large browsers, but IE6-IE8 browsers do not support them.
Special Note:
Although the background is transparent, but the text in the div is also rendered transparent, which is often not desired, you can see how to set the transparency of the div but the text is not transparent in the chapter to resolve the issue.
Original address: http://www.softwhy.com/forum.php?mod=viewthread&tid=4680
CSS how to set div background transparency and good compatibility
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
