css描边效果兼容,css滤镜实现文字描边效果（不支持FF与IE6）

心得: css滤镜效果虽然好看好用,但是不实用于网页制作中,因为它不支持FF与IE6,美工们最好不要用于网页制作中, 那样会降低自己的技术含量.

方法1:文字

方法2:

Text描边字

方法3:

body {font:12px "Verdana";filter:alpha(style=1,startY=0,finishY=100,startX=100,finishX=100);background-color:#3366cc;}

span {

position:absolute;

padding:4px;

filter:

Dropshadow(offx=1,offy=0,color=white)

Dropshadow(offx=0,offy=1,color=white)

Dropshadow(offx=0,offy=-1,color=white)

Dropshadow(offx=-1,offy=0,color=white);

}

#english {

font-size:14px;}

This is the prospect of filter - dropshadow.中文描边效果.font {

font-family: "新宋体";

font-size: 12px;

font-style. normal;

color: #FFFF00;

padding:1px;

letter-spacing: 2px;

filter:

Dropshadow(offx=1,offy=0,color=black)

Dropshadow(offx=0,offy=1,color=black)

Dropshadow(offx=0,offy=-1,color=black)

Dropshadow(offx=-1,offy=0,color=black);

}

方法4:#text { float:left; color:#C60A12;

filter:Dropshadow(offx=1,offy=0,color=#ffffff)

Dropshadow(offx=0,offy=1,color=#ffffff)

Dropshadow(offx=-1,offy=0,color=#ffffff)

Dropshadow(offx=0,offy=-1,color=#ffffff);

}

此效果是用css的阴影滤镜来实现，普通的阴影滤镜只会产生一个方向的投影，在这里定义了四个方向的投影，所以产生了描边的效果。

Text描边字