Make the PNG image as the background image transparent under IE6

Apply PNG Image
Of Transparent
Or half Transparent
Can make a very beautiful web page. Firefox and opera provide excellent support for PNG. IE
While ignoring PNG Image
This feature
"Exist", although IE
7
All supported IE
6
Or not. Query
Some materials have basically solved this problem and are ready to be applied to pjskin.

Although IE
6
Support PNG Transparent
Background JS
Program Is it very convenient, or it is better to use CSS. The following code is used:

IE
5.5 +
Alphaimageloader Filter

Syntax:

Filter: progid: DXImageTransform. Microsoft. alphaimageloader (
Enabled = benabled, sizingmethod = ssize, src = Surl)

Attribute:

Enabled: Optional. Boolean ). Set or retrieve whether the filter is activated. True | false

True: default value. Filter activation.

False: the filter is disabled.

Sizingmethod: Optional. String ). Set or retrieve the object to which the filter appliesImage
Display Mode within the boundaries of the object container. Crop: CutImage
To adapt to objects
Size.

Image: default value. Increase or decrease the size boundary of an object to adaptImage
.

Scale: ScaleImage
To adapt to the size boundary of the object.

SRC: required. String ). Specify the background image using an absolute or relative URL. If this parameter is ignored, the filter will not work.

Note:

DisplayImage
. And provideImage
The operation of cutting and changing the size. If the load is
In PNG (Portable Network Graphics) formatTransparent
Degree is also provided.

PNG (Portable Network Graphics) FormatImage
OfTransparent
Does not affect your choice of text. In other words, you can select
PNG (Portable Network Graphics) FormatImage
CompleteTransparent
Area.

After learning about the above content, you can write a simple CSSCode(Not completely correct code ):

# Div1 {

Height:6
00px;

Width: 26
0px;

Padding: 20px;

Background-repeat: Repeat;

Filter:
Progid: DXImageTransform. Microsoft. alphaimageloader (Enabled = true,
Sizingmethod = scale, src00000000bj1.png"

}

This simple CSS code can be found in IE
Normal PNG display Transparent
Background, but you will find that there is no background in ff. analyze the cause:

The alphaimageloader filter can only be IE
Yes. FF does not support this filter.

Some people write this for the first time:

Add the following paragraph in the Code: Background-image: url(bj1.png );

Although adding such a piece of code can solve the FF issue IE
Another problem occurs: The new background will overwrite the background of the filter, leading to invalid display of the filter. IE
And FF Pairs
The difference between CSS reading is as follows:

Firefox and opera fully support PNG Transparent
Image
The browser also supports the sub-selector (>), while IE
Not recognized (including IE
7), all we can use this to define
PNG in Firefox, opera, and other browsers Image
. The Code is as follows:

HTML> body # div1 {

Background-repeat: Repeat; Background-image: url(bj1.png );

}

At the same time, we onlyIE
To define a wildcard (*).IE
Filter in the browser. The Code is as follows:

* # Div1 {filter:
Progid: DXImageTransform. Microsoft. alphaimageloader (Enabled = true,
Sizingmethod = scale, src00000000bj1.png ")

}

# Div1 {} has someIE
And ff to reduce the size of the code file. The final result is as follows:

# Div1 {

Height:6
00px;

Width: 26
0px;

Padding: 20px;

Background-repeat: Repeat;

}

HTML> body # div1 {

Background-repeat: Repeat; Background-image: url(bj1.png );

}

* # Div1 {filter:
Progid: DXImageTransform. Microsoft. alphaimageloader (Enabled = true,
Sizingmethod = scale, src00000000bj1.png ")

}

Note that the alphaimageloader filter will invalidate links and buttons in the region. The solution is to add position: for links or buttons:
Relative; this code makes it relatively floating. Alphaimageloader cannot set duplicate background, soImage
The accuracy of the cut graph is very high.