Ie6 background transparency setting method ie6 background color transparency and png Image transparency solution, ie6png

Source: Internet
Author: User

Ie6 background transparency setting method ie6 background color transparency and png Image transparency solution, ie6png

Internet Explorer 6 makes us love and hate it. What we love it is that it makes the code we write more standard. What we hate is that it has too many headers.IE6 Common Bugs(Click here for details. Now, Baidu browser is used to investigate that the domestic market share is less than 6%, but we are afraid of encountering websites that need to be compatible with Internet Explorer 6.

Among them, a common problem with IE6 is the transparent background of IE6. Transparent background is mainly divided into transparent background color and background image or png image.

I. IE6 background color transparency

Generally, the following is a clear background for a browser:
Opacity: 0.5;
-Moz-opacity: 0.5;
-Webkit-opacity: 0.5;
-Khtml-opacity: 0.5;
 
-Moz-is Firefox prefix-webkit-Is Google and Apple browser prefix-kthml-for linux desktop browser

IE6 transparent backgroundFilter is required:Filter: alpha (opacity = 50 );It's okay to use genuine IE6 for testing. Sometimes ietester is not easy to use. We also know that ietester is not so complete.

Ie8 is also special:-ms-filter: "progid: DXImageTransform. Microsoft. Alpha (Opacity = 50 )";

In this way, the problem of transparent background of all browsers is fixed.

Ii. Questions about transparent background of png images in IE6

First, ie6 does not support png Image transparency. ie6 supports png8 image transparency, but does not support png24 and png32 image transparency. Therefore, we recommend that you use the png8 format if you want to consider IE6 when making images transparently. You can select the exported png version for both ps and firework.

We also know that the png8 color is not as rich as the png24 color. Sometimes, you must use the png24 color. Therefore, Mr. Xiaoqiang has prepared a js file for everyone. This js file specifically solves the transparent problem of ie6 png 24. It makes the png images on the entire page transparent, without the need to solve the problem one by one, which is effort-saving and easy to use. The usage is as follows:

Step 1: Merge the following code into the page. Pay attention to path issues!

<Script src = "iepng. js" type = "text/javascript"> </script>

<Script type = "text/javascript">
EvPNG. fix ('div, ul, img, li, input, span, B, h1, h2, h3, h4, ');
</Script>

The red part is the selector, and most of them are included. In fact, it is not replaced.

Step 2: Put the following js files into our site. So far, it has been easier to deal with the problem of transparent IE6PNG images.

The above is shared by Mr. Xiaoqiang and I hope it will help you.

Xiaoqianxiao: share your knowledge with you.

Download js files: click here


For a png transparent background image, how does one change the gray background to a transparent background in ie6?

Friends who do Web development know that PNG is a very good image format, but this good format is troublesome in the Internet Explorer 6 era, IE6 will make the transparent part of PNG appear # DBEAED color. Not transparent. In this way, the UI with good development performance under FF can be changed to IE browsing, which forces the UI to be changed to GIF, while the false transparency of GIF will cause the margin phenomenon when the background is changed. All in all, IE6 does not support png transparent background images. That is to say, even if a png image is used, the transparency feature will become invalid.

It is recommended that you search for "transparent PNG official solution under IE6". An article may be helpful to you.
 
What is the background color of a transparent png Image in ie6?

Ie6 does not support transparent background, so a background is automatically displayed.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.