Css不朽的经典—3D文字特效网站建设常州五颜六色网络技术有限公司

常州五颜六色网络技术有限公司 -> 网站建设 -> Css不朽的经典—3D文字特效

登录 -> 注册 -> 回复主题 -> 发表主题

阿七

2006-04-05 09:03

效果： R5Ti|k.~Y"
[mX\Q`)QP
3D Text g8^$,
以下是一个用了blur滤镜而另一个没用的叠加效果 k9a-\UIMet
ee6Zm+.B
Ttop.cn Ttop.cn T<!T mG
pj'Yv
Glass Text >QCVsX>~
这个是两个都用了alpha滤镜的效果 *c.*e4uzF
`g3H;E
Ttop.cnTtop.cn /1Ndir^c
GDhg VOW(
Inner Shadow _K'YaZTa;~
这个是先用了一段白色的文字，再加了mask()滤镜，再用了shadow()滤镜，最后加入chroma()滤镜形成后一段字体，放在前一段文字的相对left: -200px位置上形成的。 [i\K#O +f
``U>9S"p)
Ttop.cnTtop.cn U",kAQY
o[aRG7C
Outline Text c.r]w
用mask, glow and chroma三个滤镜联合作用 XXvM*"3D5
7iT#dpF/A
Ttop.cn eWE7>kwh
ELPzqBI
与Marquee的完美结合 w_PnEJa9
www.Ttop.cnwww.Ttop.cn >E6w,Ab
K<6)SL4
源代码： DOyYy~Q
)$XcO]
<style type="text/css"> vjmNS=l
 gd#+N]C_
</style> }Ox5,S}ra
<title>Css不朽的经典—3D文字特效</title> 9=T jSRS
<div> ~U}0=lRVS
<h2>3D Text</h2> usc"m huQ
<p>以下是一个用了blur滤镜而另一个没用的叠加效果</p> m -]E|
<p onClick="alert(this.innerHTML)"> <span class="sample" O4t0 VL$
style="width: 200px; height: 70; color: black; filter: Blur(Add=0, Direction=135, Strength=10);" TuG%oV}
>Ttop.cn</span><span class="sample" >{R+j4%
style="position: relative; left: -201; top: -15; width: 200; color: #2984ff;"> UXgeL2`;
Ttop.cn</span> </p> RA^6c![
<h2>Glass Text</h2> 3e,"B S)+
<p>这个是两个都用了alpha滤镜的效果</p> 29z$z$l4
<p onClick="alert(this.innerHTML)"> <span class="sample" <aSjK#
style="width: 200px; height: 70; color: lightskyblue; filter: Alpha(Opacity=60) Blur(Add=0, Direction=135, Strength=20);" `cg yiJ
>Ttop.cn</span><span class="sample" &Zy% Zz
style="position: relative; left: -201; top: -15; width: 200; color: lightskyblue; filter: Alpha(Opacity=60);" djmd @{Djt
>Ttop.cn</span> </p> h\-3Y U
<h2>Inner Shadow</h2> JIL(\d
<p>这个是先用了一段白色的文字，再加了mask()滤镜，再用了shadow()滤镜，最后加入chroma()滤镜形成后一段字体，放在前一段文字的相对left: vX30Ijm
-200px位置上形成的。</p> 6 9+Pf*
<p onClick="alert(this.innerHTML)"> <span class="sample" \&BT#8ELG
style="width: 200px; height: 70; color: white;" o3C GG
>Ttop.cn</span><span class="sample" Y+)qb);
style="width: 200px; height: 70; position: relative; left: -200; filter: mask(color=red) shadow(direction=135) chroma(color=red);" >v#6SDg
>Ttop.cn</span> </p> =W[M=_0u
<h2>Outline Text</h2> T0|hp7 WM
<p>用mask, glow and chroma三个滤镜联合作用</p> [[s^rC<d
<p onClick="alert(this.innerHTML)"> <span class="sample" style="width: 200px; height: 70; filter: mask(color=red) glow(color=black, strength=1) chroma(color=red);">Ttop.cn</span> </p> <P@ "VwUX
<h2>与Marquee的完美结合</h2> =j^ >sg]
<p onClick="alert(this.innerHTML)"> <span class="sample" PjE%_M<
style="width:320px; height: 70; color: black; filter: Blur(Add=0, Direction=135, Strength=10);" 0g'MFS
><marquee width:300 height:70 scrollamount="1" behavior="alternate" class="sample">www.Ttop.cn</marquee></span> 'IQ;;[Q
<span class="sample" j4%\'xj:
style="position: relative; left: -320; top: -15; width: 320; color: #2984ff;"> Qa#Em1co
<marquee width:320 height:70 scrollamount="1" behavior="alternate" class="sample">www.Ttop.cn</marquee></span> </p> y?'Z'
</div>