1. 程式人生 > >css 橫向漸變 圖片陰影效果 字型模糊效果

css 橫向漸變 圖片陰影效果 字型模糊效果

(必須加在Table的TD裡,如果TD有背景就會遮蓋陰影,可以把背景放到外套的表格裡去)

背景顏色漸變
橫向漸變
style="filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#98B2E6', gradientType='1')"
縱向漸變
style="filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#ff0000', endColorStr='#ffffff', gradientType='0')"

圖片陰影效果
style="filter:progid:DXImageTransform.Microsoft.DropShadow(color=#cccccc,offX=2,offY=2,positive=true);"

文字邊框特效
style="filter:progid:DXImageTransform.Microsoft.Glow(color=#ffffff,strength=1);"

背景圖隨表格拉伸而不重複的拉伸填充
style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/bg.jpg', sizingMethod='scale')"

字型模糊效果
style="FILTER: blur(add=1, direction=100,strength=1); "

文字陰影效果
style="filter:dropshadow(color=#ffffcc,offx=1,offy=1)"

PNG圖片背景透明
style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/Icon01.png'); width:50px; height:33px; "

TD強制不換行,同時多餘部分隱去
style="white-space:nowrap;overflow: hidden;"

TD強制換行
style="word-break:break-all;"

圖片透明效果
filter:alpha(opacity=30);

filter:alpha(opacity=30,finishOpacity=0,style=0,startx=10,starty=5,finishx=70,finishy=20);
"opacity"代表透明度水準。預設的範圍是從0 到 100,他們其實是百分比的形式。 
也就是說,0代表完全透明,100代表完全不透明。”finishopacity"是一個可選引數, 
如果想要設定漸變的透明效果,就可以使用他們來指定結束時的透明度。範圍也是0 到 100。 
"style" 引數指定了透明區域的形狀特徵。其中0代表統一形狀、1代表線形、2代表放射狀、 
3代表長方形。”STARTX“和”STARTY“代表漸變透明效果的開始X和Y座標。”FINISHX“和” 
FINISHY“代表漸變透明效果結束X和Y 的座標。