Please create a new file testimage.html
Attention: 11 Filter effects for static pictures-Ie7 and non-IE browsers are not supported.
Welcome and invite Month Exchange, net technology and software architecture
The contents are as follows (can be modified by oneself):
Copy Code code as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/>
<title> Test Picture Effect </title>
<style>
. Filter1
{...} {
Filter:alpha (opacity=50,finishopacity=80,style=0);
}
. Filter2
{...} {
Filter:fliph;
}
. Filter3
{...} {
FILTER:FLIPV;
}
. Filter4
{...} {
Filter:gray;
}
. Filter5
{...} {
Filter:xray;
}
. Filter6
{...} {
Filter:invert;
}
. Filter7
{...} {
Filter:glow (color= #4A7AC9, strength=50);
}
. Filter8
{...} {
Filter:shadow (color= #000000, direction=135);
}
. Filter9
{...} {
Filter:dropshadow (color= #000000, offx=50,offy=50);
}
. Filter10
{...} {
Filter:blur (direction=135);
}
. Filter11
{...} {
Filter:wave (freq=7,strength=9,lightstrength=5,phase=5);
}
</style>
<body>
<table width= "100%" border= "0" cellspacing= "0" cellpadding= "0" >
<tr>
<td> artwork <br/></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td><br/>
Translucent <br/>
Opacity: Transparency at the beginning. <br/>
Finishopacity: The transparency at the end. <br/>
Style:0 is the average transparent 1 for the linear transparent 2 is the circular transparent 3 is the diamond transparent <br/></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><br/>
Flip <br/> Left and right
</td>
</tr>
<tr>
<td></td>"
</tr>
<tr>
<td><br/>
Flip <br/></td> up and down
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><br/>
Grayscale <br/></td>
</tr>
<tr>
<td></td>"
</tr>
<tr>
<td><br/>
X-ray <br/></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><br/>
Color Swap <br/></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><br/>
Glow Border <br/>
Color for the luminous colour code, strength is the luminous intensity, the filter width = width + Luminous intensity x2, filter high = Figure High + luminous intensity x2+10<br/></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><br/>
Projection Border <br/>
The color is the luminous colour code, the direction represents the direction (can only be 45 degree multiples such as: 45,90,135,180,225,270,315 degree), the filter width = the width +25, the filter height = the figure Gao +40<br/></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><br/>
Shaded Border <br/>
Color is the luminous colour code, OFFX indicates that the horizontal displacement offy represents the vertical displacement (can be positive and negative), the filter width = width + Horizontal Displacement absolute value +10, filter height = Figure High + vertical Displacement absolute value +2) <br/></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><br/>
Blur Border <br/>
Direction represents the direction (can only be 45 degrees of multiples such as: 45,90,135,180,225,270,315), filter width = +15, filter height = Figure High +30<br/></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><br/>
Wave Border <br/>
FREQ represents waveform frequency (>0), strength indicates amplitude strength (>0), lightstrength indicates peak strength (0~100 the higher the Black), phase indicates starting phase (0~100), filter width = width + amplitude intensity x2
Filter height = Figure High + amplitude strength x2+10<br/></td>
</tr>
<tr>
<td></td>
</tr>
</table>
</body>
The effect is as follows: