CSS使用大全，想学习或者了解CSS的网友一定不可错过

<style>

IMG {border:2px solid black}

BODY{

margin:0;

background:white;

font-family:verdana;

font-size:80%;

}

.bar{

background:#336699;

width:100%;

height:30px;

border-top:1px solid #99CCFF;

border-bottom:1px solid #000000;

}

.desbar{

background:#FFFFFF;

width:100%;

padding: 10px;

border-top:1px solid #CCCCCC;

border-bottom:1px solid #000000;

color:black;

font-size:8pt;

}

.title{

font-size:15pt;

color:white;

padding-left:10px;

}

PRE { margin:0}

a:link

{

text-decoration:none;

color:white

}

a:visited

{

text-decoration:none;

color:white

}

a:active

{

text-decoration:none;

color:white

}

a:hover

{

text-decoration:none;

color:yellow

}

SELECT { font-size:9pt; border:2px; }

</style>

var browserCapable = true; // Prevents errors on downlevel browsers

var startImage = "/img/200407101.gif"; // /workshop/graphics/

var endImage = "/img/200407102.gif";

var featuresHeader = "<B>Features:</B><BR>"

var sSinQut ="'";

var sRandomBarsOrientationText="";

function copy2Clipboard()

{

// Copy displayed code to user's clipboard.

var textRange = document.body.createTextRange();

textRange.moveToElementText(oCodeSpan);

textRange.execCommand("Copy");

}

function highlightText(whatToHighlight) {

var oRng = document.body.createTextRange();

oRng.moveToElementText(oCodePre);

oRng.execCommand("RemoveFormat");

var oHL = document.body.createTextRange();

oHL.moveToElementText(oCodePre);

oHL.findText(whatToHighlight);

oHL.execCommand("Bold");

}

function switchContent(obj) {

oContentHolder.innerHTML=obj.innerHTML;

oImg.src=startImage;

if (obj==filterSection){

changeFilter();

updateFilterCode();

}

else {

imgObjText.innerHTML = "<BR><b>First Page</b><BR><BR>Using the <B>apply</B> method prepares this SPAN element for content changes.";

changeTrans();

updateTransCode();

}

function getControlObject(controlName) {

var obj=null;

for (x=0; x < document.all(controlName).length; x++) {

objTemp = document.all(controlName,x);

if (objTemp.parentElement.isSource==null) {

obj=objTemp;

}

return(obj);

}

function disableControlObject(controlName) {

for (x=0; x < document.all(controlName).length; x++) {

document.all(controlName,x).disabled=true;

}

function enableControlObject(controlName) {

for (x=0; x < document.all(controlName).length; x++) {

document.all(controlName,x).disabled=false;

}

function changeFilter() {

var selectObject = getControlObject("oSelect");

var selectedValue = selectObject.options[selectObject.selectedIndex].value;

var transitionAsFilter = selectObject.options[selectObject.selectedIndex].TRANS;

imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";

imgObj.style.backgroundColor='skyblue';

imgObj.style.color='darkred';

if (selectedValue != "empty") {

if (selectedValue.indexOf('AlphaImageLoader')!=-1) {

oControlsSpan.innerHTML = oAlphaImageLoaderControls.innerHTML;

alphaImageLoaderFilterChange();

}

else if (selectedValue.indexOf('Blur')!=-1) {

imgObj.style.backgroundColor='';

imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";

oControlsSpan.innerHTML = oBlurControls.innerHTML;

blurFilterChange();

}

else if (selectedValue.indexOf('Alpha')!=-1) {

oControlsSpan.innerHTML = oAlphaControls.innerHTML;

alphaFilterChange();

}

else if (selectedValue.indexOf('Emboss')!=-1) {

oControlsSpan.innerHTML = "";

embossFilterChange();

}

else if (selectedValue.indexOf('Engrave')!=-1) {

oControlsSpan.innerHTML = "";

engraveFilterChange();

}

else if (selectedValue.indexOf('Pixelate')!=-1) {

oControlsSpan.innerHTML = oPixelateFilterControls.innerHTML;

pixelateFilterChange();

}

else if (selectedValue.indexOf('DropShadow')!=-1) {

imgObj.style.backgroundColor='';

imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";

oControlsSpan.innerHTML = oDropShadowControls.innerHTML;

dropShadowFilterChange();

}

else if (selectedValue.indexOf('Chroma')!=-1) {

oControlsSpan.innerHTML = oChromaControls.innerHTML;

chromaFilterChange();

}

else if (selectedValue.indexOf('BasicImage')!=-1) {

oControlsSpan.innerHTML = oBasicImageControls.innerHTML;

basicImageFilterChange();

}

else {

imgObj.style.filter=selectedValue;

oControlsSpan.innerHTML = '';

}

if (oControlsSpan.innerHTML!='') {

oControlsSpan.innerHTML = featuresHeader + oControlsSpan.innerHTML;

}

if (transitionAsFilter == "TRUE") {

oControlsSpan.innerHTML = oControlsSpan.innerHTML + oGlobalControls.innerHTML;

progressChange();

}

else {

imgObj.style.filter='';

oControlsSpan.innerHTML = featuresHeader + 'No filter is currently selected.';

}

updateFilterCode();

}

function updateFilterCode() {

oCodePre.innerText=imgObj.outerHTML;

}

function alphaFilterChange(){

var cmd;

var controlObject = getControlObject("styleList");

var style = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("opacityList");

var opacity = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Alpha( " ;

cmd = cmd + "style=" + style + ",opacity=" + opacity ;

if (style!=0){

controlObject = getControlObject("finishOpacityList");

enableControlObject("finishOpacityList");

var finishOpacity = controlObject.options[controlObject.selectedIndex].value;

cmd = cmd + ",finishOpacity=" + finishOpacity ;

if (style==1){

controlObject = getControlObject("startXList");

enableControlObject("startXList");

var startX = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("finishXList");

enableControlObject("finishXList");

var finishX = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("startYList");

enableControlObject("startYList");

var startY = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("finishYList");

enableControlObject("finishYList");

var finishY = controlObject.options[controlObject.selectedIndex].value;

cmd = cmd + ",startX=" + startX + ",finishX=" + finishX ;

cmd = cmd + ",startY=" + startY + ",finishY=" + finishY;

}

else{

disableControlObject("startXList");

disableControlObject("finishXList");

disableControlObject("startYList");

disableControlObject("finishYList");

}

else{

disableControlObject("finishOpacityList");

disableControlObject("startXList");

disableControlObject("finishXList");

disableControlObject("startYList");

disableControlObject("finishYList");

}

cmd = cmd + ")'";

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function alphaImageLoaderFilterChange(){

var cmd;

var controlObject = getControlObject("srcList");

var src = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("sizingMethodList");

var sizingmethod = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.AlphaImageLoader( " ;

cmd = cmd + "src=" + src + ", sizingmethod=" + sizingmethod + ")'";

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function basicImageFilterChange(){

var cmd;

var controlObject = getControlObject("rotationList");

var rotation = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("mirrorSwitch");

controlObject.checked==true ? mirror = 1 : mirror = 0

controlObject = getControlObject("invertSwitch");

controlObject.checked==true ? invert = 1 : invert = 0

controlObject = getControlObject("xraySwitch");

controlObject.checked==true ? xray = 1 : xray = 0

controlObject = getControlObject("grayscaleSwitch");

controlObject.checked==true ? grayscale = 1 : grayscale = 0

controlObject = getControlObject("basicImageOpacityList");

var opacity = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.BasicImage( Rotation="+ rotation +",Mirror=" + mirror + ",Invert=" + invert + ",XRay=" + xray + ",Grayscale=" + grayscale + ",Opacity=" + opacity;

cmd = cmd + ")'";

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function blurFilterChange(){

var controlObject = getControlObject("pixelRadiusList");

var pixelRadius = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("makeShadowSwitch");

var makeShadow = controlObject.checked;

var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Blur( PixelRadius="+ pixelRadius +"," + "MakeShadow=" + makeShadow;

if (makeShadow){

controlObject = getControlObject("shadowOpacityList");

enableControlObject("shadowOpacityList");

var shadowOpacity = controlObject.options[controlObject.selectedIndex].value;

cmd = cmd + ",ShadowOpacity=" + shadowOpacity +")'";

}

else{

disableControlObject("shadowOpacityList");

cmd = cmd +")'";

}

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function embossFilterChange(){

// var controlObject = getControlObject("biasList");

// var bias = controlObject.options[controlObject.selectedIndex].value;

var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Emboss()'"; // Bias=" + bias + "

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function engraveFilterChange(){

// var controlObject = getControlObject("biasList");

// var bias = controlObject.options[controlObject.selectedIndex].value;

var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Engrave( )'"; // Bias=" + bias + "

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function pixelateFilterChange(){

var controlObject = getControlObject("maxSquareFList");

var maxSquare = controlObject.options[controlObject.selectedIndex].value;

var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Pixelate( maxsquare="+ maxSquare +")'";

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function dropShadowFilterChange(){

var controlObject = getControlObject("shadowColorList");

var shadowColor = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("offsetXList");

var offX = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("offsetYList");

var offY = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("positiveSwitch");

var positive = controlObject.checked;

var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.dropShadow( Color=" + shadowColor + ",offX=" + offX + ",offY=" + offY + ",positive=" + positive + ")'";

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function chromaFilterChange(){

var controlObject = getControlObject("chromaColorList");

var chromaColor = controlObject.options[controlObject.selectedIndex].value;

var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Chroma( Color="+ chromaColor +")'";

eval(cmd);

updateFilterCode();

highlightText(cmd);

}

function transStart(arg) {

var obj = getControlObject("oSelect");

var selectedValue=obj.options[obj.selectedIndex].value;

if (selectedValue != "empty") {

imgObj.filters[0].apply();

if (arg.src.indexOf(startImage)!=-1) {

arg.src = endImage;

imgObj.style.backgroundColor = "gold";

imgObjText.innerHTML = "<BR><B>Second Page</B><BR><BR>Using the <B>play</B> method reveals the changes in the SPAN element content.";

}

else {

arg.src = startImage;

imgObj.style.backgroundColor = "skyblue";

imgObjText.innerHTML = "<BR><b>First Page</b><BR><BR>Using the <B>apply</B> method prepares this SPAN element for content changes.";

}

imgObj.filters[0].play();

}

function changeTrans() {

var obj = getControlObject("oSelect");

var selectedValue = obj.options[obj.selectedIndex].value;

sRandomBarsOrientation="";

if (selectedValue != "empty") {

if (selectedValue.indexOf('Barn')!=-1) {

oControlsSpan.innerHTML = oBarnControls.innerHTML;

barnTransChange();

}

else if (selectedValue.indexOf('Blinds')!=-1) {

oControlsSpan.innerHTML = oBlindsControls.innerHTML;

blindsTransChange();

}

else if (selectedValue.indexOf('Checkerboard')!=-1) {

oControlsSpan.innerHTML = oCheckerboardControls.innerHTML;

checkerboardTransChange();

}

else if (selectedValue.indexOf('Fade')!=-1) {

oControlsSpan.innerHTML = oFadeControls.innerHTML;

fadeTransChange();

}

else if (selectedValue.indexOf('Iris')!=-1) {

oControlsSpan.innerHTML = oIrisControls.innerHTML;

irisTransChange();

}

else if (selectedValue.indexOf('Pixelate')!=-1) {

oControlsSpan.innerHTML = oPixelateTransControls.innerHTML;

pixelateTransChange();

}

else if (selectedValue.indexOf('RadialWipe')!=-1) {

oControlsSpan.innerHTML = oRadialWipeControls.innerHTML;

radialWipeTransChange();

}

else if (selectedValue.indexOf('RandomBars')!=-1) {

oControlsSpan.innerHTML = oRandomBarsControls.innerHTML;

randomBarsTransChange();

}

else if (selectedValue.indexOf('Slide')!=-1) {

oControlsSpan.innerHTML = oSlideControls.innerHTML;

slideTransChange();

}

else if (selectedValue.indexOf('Spiral')!=-1) {

oControlsSpan.innerHTML = oSpiralControls.innerHTML;

spiralTransChange();

}

else if (selectedValue.indexOf('Stretch')!=-1) {

oControlsSpan.innerHTML = oStretchControls.innerHTML;

stretchTransChange();

}

else if (selectedValue.indexOf('Strips')!=-1) {

oControlsSpan.innerHTML = oStripsControls.innerHTML;

stripsTransChange();

}

else if (selectedValue.indexOf('Wheel')!=-1) {

oControlsSpan.innerHTML = oWheelControls.innerHTML;

wheelTransChange();

}

else if (selectedValue.indexOf('GradientWipe')!=-1) {

oControlsSpan.innerHTML = oWipeControls.innerHTML;

wipeTransChange();

}

else if (selectedValue.indexOf('Zigzag')!=-1) {

oControlsSpan.innerHTML = oZigzagControls.innerHTML;

zigzagTransChange();

}

else {

imgObj.style.filter=selectedValue;

oControlsSpan.innerHTML = featuresHeader + 'The transition does not support additional features.';

}

else {

imgObj.style.filter=null;

oControlsSpan.innerHTML = featuresHeader + 'No transition is currently selected.';

}

updateTransCode();

}

function updateTransCode() {

var obj = getControlObject("oSelect");

var selectedValue=obj.options[obj.selectedIndex].value;

var imgContents = imgObj.outerHTML;

if (selectedValue != "empty") {

oCodePre.innerText=completeTransCode(imgContents);

}

else {

oCodePre.innerText=imgContents;

}

highlightText(imgContents);

}

function completeTransCode(imgText) {

scriptBlock = '';

scriptBlock = scriptBlock + 'var startImage ="' + startImage + '";\n';

scriptBlock = scriptBlock + 'var endImage="' + endImage + '";\n';

scriptBlock = scriptBlock + 'function doTrans() {\n';

scriptBlock = scriptBlock + ' ' + sRandomBarsOrientationText + '\n';

scriptBlock = scriptBlock + ' imgObj.filters[0].apply();\n';

scriptBlock = scriptBlock + ' if (oImg.src.indexOf(startImage)!=-1) {\n';

scriptBlock = scriptBlock + ' oImg.src = endImage;\n';

scriptBlock = scriptBlock + ' imgObj.style.backgroundColor = "gold";\n';

scriptBlock = scriptBlock + ' imgObjText.innerHTML = ';

scriptBlock = scriptBlock + ' "<BR><B>Second Page</B><BR><BR>Using the <B>play</B> method reveals the changes in the SPAN element content."';

scriptBlock = scriptBlock + ' }\n';

scriptBlock = scriptBlock + ' else {\n';

scriptBlock = scriptBlock + ' oImg.src = startImage;\n';

scriptBlock = scriptBlock + ' imgObj.style.backgroundColor = "skyblue";\n';

scriptBlock = scriptBlock + ' imgObjText.innerHTML = ';

scriptBlock = scriptBlock + ' "<BR><b>First Page</b><BR><BR>Using the <B>apply</B> method prepares this SPAN element for content changes."';

scriptBlock = scriptBlock + ' }\n';

scriptBlock = scriptBlock + ' imgObj.filters[0].play();\n';

scriptBlock = scriptBlock + '}\n'

buttonBlock = '\<BR\>\<BR\>\n<BUTTON onclick="doTrans()">Play Transition</BUTTON>\n'

fullBlock = '\<HEAD\>\n\<SCRIPT\>\n' + scriptBlock + '\<\/SCRIPT\>\n\<\/HEAD\>\n\<BODY\>\n' + imgText + buttonBlock + '\<\/BODY\>';

return(fullBlock);

}

function barnTransChange(){

var controlObject = getControlObject("barnMotionList");

var motion = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("barnVerticalList");

var orientation = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Barn( motion="+ motion+",orientation="+ orientation+")'";

eval(cmd);

updateTransCode();

}

function blindsTransChange(){

var controlObject = getControlObject("blindsBandsList");

var bands = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("blindsDirectionList");

var direction = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Blinds( Bands="+ bands+",direction="+ direction+")'";

eval(cmd);

updateTransCode();

}

function checkerboardTransChange(){

var controlObject = getControlObject("checkerboardDirectionList");

var direction = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("squaresXList");

var squaresX = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("squaresYList");

var squaresY = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Checkerboard( Direction="+ direction+",SquaresX="+ squaresX+",SquaresY="+ squaresY+")'";

eval(cmd);

updateTransCode();

}

function fadeTransChange(){

var controlObject = getControlObject("fadeOverlapList");

var overlap = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Fade(Overlap=" + overlap +")'";

eval(cmd);

updateTransCode();

}

function irisTransChange(){

var controlObject = getControlObject("irisStyleList");

var irisstyle = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("irisMotionList");

var motion = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Iris(irisstyle="+ irisstyle+",motion=" + motion +")'";

eval(cmd);

updateTransCode();

}

function pixelateTransChange(){

var controlObject = getControlObject("maxSquareTransList");

var maxSquare = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Pixelate(MaxSquare="+ maxSquare+")'";

eval(cmd);

imgObj.filters[0].progress=0;

updateTransCode();

}

function randomBarsTransChange(){

var controlObject = getControlObject("randomBarsVerticalList");

var orientation = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.RandomBars()'";

eval(cmd);

cmd = "imgObj.filters[0].orientation='" + orientation + "';";

eval(cmd);

sRandomBarsOrientationText = cmd;

updateTransCode();

}

function radialWipeTransChange(){

controlObject = getControlObject("radialWipeStyleList");

wipestyle = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.RadialWipe(wipestyle="+ wipestyle+")'";

eval(cmd);

updateTransCode();

}

function slideTransChange(){

controlObject = getControlObject("slideStyleList");

slidestyle = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("slideBandsList");

bands = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Slide(slidestyle="+ slidestyle+",Bands=" + bands +")'";

eval(cmd);

updateTransCode();

}

function spiralTransChange(){

controlObject = getControlObject("spiralGridSizeXList");

gridSizeX = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("spiralGridSizeYList");

gridSizeY = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Spiral(GridSizeX="+ gridSizeX+",GridSizeY=" + gridSizeY +")'";

eval(cmd);

updateTransCode();

}

function stretchTransChange(){

controlObject = getControlObject("stretchStyleList");

stretchstyle = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Stretch(stretchstyle="+ stretchstyle+")'";

eval(cmd);

updateTransCode();

}

function stripsTransChange(){

controlObject = getControlObject("movementList");

motion = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Strips(motion="+ motion+")'";

eval(cmd);

updateTransCode();

}

function wheelTransChange(){

controlObject = getControlObject("spokesList");

spokes = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Wheel(spokes="+ spokes+")'";

eval(cmd);

updateTransCode();

}

function wipeTransChange(){

controlObject = getControlObject("wipeReverseSwitch");

motion = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("gradientSizeList");

gradientSize = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("wipeStyleList");

wipestyle = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.GradientWipe(GradientSize="+ gradientSize+",wipestyle=" + wipestyle +",motion=" + motion +")'";

eval(cmd);

updateTransCode();

}

function zigzagTransChange(){

controlObject = getControlObject("zigzagGridSizeXList");

gridSizeX = controlObject.options[controlObject.selectedIndex].value;

controlObject = getControlObject("zigzagGridSizeYList");

gridSizeY = controlObject.options[controlObject.selectedIndex].value;

cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Zigzag(GridSizeX="+ gridSizeX+",GridSizeY=" + gridSizeY +")'";

eval(cmd);

updateTransCode();

}

</SCRIPT>

</HEAD>

</SPAN>

<BR>

<P>效果类型: <INPUT TYPE=radio NAME="DemoChoice" VALUE="Filters" onclick="switchContent(filterSection); imgObj.style.color='darkred'; imgObj.style.fontWeight='bold';" CHECKED> 滤镜

<INPUT TYPE=radio NAME="DemoChoice" VALUE="Transitions" onclick="switchContent(transitionSection); imgObj.style.color='black'; imgObj.style.fontWeight='normal';"> 渐变

</P>

</SPAN>

</SPAN>

</DIV>

复制显示效果代码

</BUTTON>

</SPAN>

</SPAN>

请选择一个滤镜:

<OPTION value=progid:DXImageTransform.Microsoft.Alpha SELECTED>Alpha</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.AlphaImageLoader>AlphaImageLoader</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.BasicImage >BasicImage</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Chroma>Chroma</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.DropShadow>DropShadow</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Emboss >Emboss</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Engrave>Engrave</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Pixelate>Pixelate</OPTION>

</SELECT><hr></SPAN>

请选择渐变类型:

<OPTION value=progid:DXImageTransform.Microsoft.Blinds()>Blinds</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Checkerboard()>Checkerboard</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Inset()>Inset</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Pixelate()>Pixelate</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.RadialWipe()>RadialWipe</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.RandomBars()>Random Bars</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Slide()>Slide</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Spiral()>Spiral</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Stretch()>Stretch</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.CrStrips()>Strips</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Wheel()>Wheel</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.GradientWipe()>GradientWipe</OPTION>

<OPTION value=progid:DXImageTransform.Microsoft.Zigzag()>Zigzag</OPTION>

</SELECT>

Style:

<OPTION value=0>0 - Uniform Opacity</OPTION>

<OPTION value=1 SELECTED>1 - Linear Opacity Change</OPTION>

<OPTION value=2>2 - Radial Opacity Change</OPTION>

<OPTION value=3>3 - Rectangular Opacity Change</OPTION>

</SELECT> <BR/><BR/>

Opacity:

</SELECT>

FinishOpacity:

</SELECT> <BR/><BR/>

StartX:

</SELECT>

FinishX:

</SELECT>

StartY:

</SELECT>

FinishY:

</SELECT>

</SPAN>

Src (source image):

<OPTION value='photo/notebook.GIF' SELECTED>Spiral Bound</OPTION>

<OPTION value='photo/MOUSE2.GIF'>Mouse</OPTION>

</SELECT>

<BR/><BR/>SizingMethod:

<OPTION value='crop' SELECTED>Crop - Crop at boundaries</OPTION>

<OPTION value='image'>Image - Normal image size</OPTION>

<OPTION value='scale'>Scale - Scale to window</OPTION>

</SELECT><BR/><BR/><BR/><BR/>

</SPAN>

Bias:

</SELECT><BR/><BR/><BR/><BR/>

</SPAN>

Bias:

</SELECT><BR/><BR/><BR/><BR/>

</SPAN>

PixelRadius:

</SELECT> <BR/><BR/>

MakeShadow</INPUT>

<BR><BR>ShadowOpacity:

</SELECT> <BR/><BR/>

</SPAN>

MaxSquare:

</SELECT>

</SPAN>

Color:

<OPTION value=DDDDDD>Light Gray (DDDDDD)</OPTION>

<OPTION value=000000>Black (000000)</OPTION>

<OPTION value=FFFF00>Yellow (FFFF00)</OPTION>

</SELECT>

OffX: <SELECT onchange=dropShadowFilterChange() name=OffsetXList>

</SELECT>

OffY: <SELECT onchange=dropShadowFilterChange() name=OffsetYList>

</SELECT><BR><BR>

<INPUT onclick=dropShadowFilterChange() type=checkbox CHECKED name=positiveSwitch>Positive</INPUT>

</SPAN>

Color:

<OPTION value='#FFFFFF' SELECTED>White (FFFFFF)</OPTION>

<OPTION value='#000000'>Black (000000)</OPTION>

</SELECT><BR/><BR/><BR/><BR/>

</SPAN>

<SPAN

id=oBasicImageControls style="DISPLAY: none" isSource="TRUE"><BR/>

Rotation:

<OPTION value=0 SELECTED>0 - 0 degrees</OPTION>

<OPTION value=1>1 - 90 degrees</OPTION>

<OPTION value=2>2 - 180 degrees</OPTION>

<OPTION value=3>3 - 270 degrees</OPTION>

</SELECT><BR/><BR/>

Opacity: <SELECT onchange=basicImageFilterChange() name=basicImageOpacityList>

</SELECT><BR><BR/>

<INPUT onclick=basicImageFilterChange() type=checkbox name=mirrorSwitch>Mirror</INPUT>

<INPUT onclick=basicImageFilterChange() type=checkbox name=invertSwitch>Invert</INPUT><BR><BR/>

<INPUT onclick=basicImageFilterChange() type=checkbox name=grayscaleSwitch>Grayscale</INPUT>

</SPAN>

Motion:

<OPTION value=out SELECTED>Out - From inside outward</OPTION>

<OPTION value=in>In - From outside inward</OPTION>

</SELECT> <BR/><BR/>

Orientation:

<OPTION value=horizontal>Horizontal</OPTION>

<OPTION value=vertical SELECTED>Vertical</OPTION>

</SELECT>

</SPAN>

Bands: <SELECT onchange=blindsTransChange() name=blindsBandsList>

</SELECT>

Direction:

<OPTION value=right>Right</OPTION>

</SELECT>

</SPAN>

Direction: <SELECT onchange=checkerboardTransChange() name=checkerboardDirectionList>

<OPTION value=right SELECTED>Right</OPTION>

</SELECT><BR><BR>

SquaresX: <SELECT onchange=checkerboardTransChange() name=squaresXList>

</SELECT>

SquaresY: <SELECT onchange=checkerboardTransChange() name=squaresYList>

</SELECT> </SPAN>

Overlap: <SELECT onchange=fadeTransChange() name=fadeOverlapList>

</SELECT>

</SPAN>

<SPAN id=oIrisControls

style="DISPLAY: none" isSource="TRUE"><BR/>

IrisStyle: <SELECT onchange=irisTransChange() name=irisStyleList>

<OPTION value=DIAMOND>Diamond</OPTION>

<OPTION value=CIRCLE>Circle</OPTION>

<OPTION value=CROSS>Cross</OPTION>

<OPTION value=SQUARE>Square</OPTION>

</SELECT> <BR><BR>

Motion: <SELECT onchange=irisTransChange() name=irisMotionList>

<OPTION value=out SELECTED>Out - From inside outward</OPTION>

<OPTION value=in>In - From outside inward</OPTION>

</SELECT>

</SPAN>

MaxSquare: <SELECT onchange=pixelateTransChange() name=maxSquareTransList>

</SELECT>

</SPAN>

<SPAN id=oRadialWipeControls

style="DISPLAY: none" isSource="TRUE"><BR/>

WipeStyle: <SELECT onchange=radialWipeTransChange() name=radialWipeStyleList>

<OPTION value=CLOCK SELECTED>Clock</OPTION>

<OPTION value=WEDGE>Wedge</OPTION>

<OPTION value=RADIAL>Radial</OPTION>

</SELECT>

</SPAN>

Orientation: <SELECT onchange=randomBarsTransChange() name=randomBarsVerticalList>

<OPTION value=horizontal SELECTED>Horizontal</OPTION>

<OPTION value=vertical>Vertical</OPTION>

</SELECT>

</SPAN>

SlideStyle: <SELECT onchange=slideTransChange() name=slideStyleList>

</SELECT> <BR/><BR/>

Bands: <SELECT onchange=slideTransChange() name=slideBandsList>

</SELECT>

</SPAN>

GridSizeX: <SELECT onchange=spiralTransChange() name=spiralGridSizeXList>

</SELECT>

GridSizeY: <SELECT onchange=spiralTransChange() name=spiralGridSizeYList>

</SELECT>

</SPAN>

StretchStyle: <SELECT onchange=stretchTransChange() name=stretchStyleList>

</SELECT>

</SPAN>

Motion: <SELECT onchange=stripsTransChange() name=movementList>

<OPTION value=rightup>Right-up</OPTION>

<OPTION value=rightdown>Right-down</OPTION>

</SELECT>

</SPAN>

Spokes:

</SELECT>

</SPAN>

GradientSize: <SELECT onchange=wipeTransChange() name=gradientSizeList>

</SELECT><BR><BR>

WipeStyle: <SELECT onchange=wipeTransChange() name=wipeStyleList>

<OPTION value=0 SELECTED>0 - Left-to-right motion</OPTION>

<OPTION value=1>1 - Top-to-bottom motion</OPTION>

</SELECT><BR><BR>

Motion: <SELECT onchange=wipeTransChange() name=wipeReverseSwitch>

<OPTION value=forward SELECTED>Forward</OPTION>

<OPTION value=reverse>Reverse</OPTION>

</SELECT>

</SPAN>

GridSizeX:

</SELECT>

GridSizeY: <SELECT onchange=zigzagTransChange() name=zigzagGridSizeYList>

</SELECT>

</SPAN>