[CSS]-Allow IE6 to support PNG-24 transparent background (multiple methods)

1. Use iepngfix

Example: http://www.twinhelix.com/css/iepngfix/demo/

: Http://www.twinhelix.com/css/iepngfix/

Advantages: the entire page can automatically process the transparent background of the PNG-24, do not have to do another picture instead of trouble.

Disadvantage: you cannot use too many pages. Otherwise, the page loading speed slows down significantly.

**************************************** **************************************** *****************

2. Apply the filter effect

Although not every browser can support filter, but just to solve the PNG-24 transparent background, it doesn't matter.

Source: youdaoSource code

 <  Style  >  
Body  {  
Background :  Url(bg.gif)  ;  
  }  
. Test  {  
Width  :  451px  ;  
Height :  42px  ;  
Background  :  Url(test.png)  ;  
_ Background  :  None  ; 
_ Filter  :  Progid: dximagetransform.microsoft.alphaimageloader(src+'test.png ', sizingmethod = 'crop ')  ;  
  }  
  </  Style  >  
  <  Div Class  = "Test"  > </  Div  > 

Advantages:CodeSmall, simple.

Disadvantage: Use a filter on the image of the PNG-24 Image

**************************************** **************************************** *****************

3. Use a picture of the PNG-8 instead

Source: Network

PNG-8 is generally saved with PS :( in "file-> storage for Web and device format" Save, sometimes will use the "diffusion transparency imitation color ")

Advantage: you do not need to process it as mentioned above

Disadvantage: if there is a rounded corner, it will look a little right angle. If there is a gradient outside the image (including the shadow effect), it will easily make most of the color of the Shadow replaced by its hidden color, resulting in high distortion.

**************************************** **************************************** *****************

4. Use CSS hack

Can make the normal display of the PNG-24 is directly displayed, otherwise use CSS hack to replace other formats of pictures (such as JPG), this method is to see other people's source code to know, belong to the most helpless method.

Advantage: at least the image can be displayed normally.

Disadvantage: the website has many files, which occupies a large space and is inconvenient to modify.

**************************************** **************************************** *****************

PS: PNG-8 and GIF transparent background can make IE6 direct display, but compared with the PNG-24, the picture distortion is too outrageous