阿七
级别: 未验证会员
精华:
0
发帖: 909
威望: 0 点
金钱: 2161 RMB
贡献值: 0 点
在线时间:512(小时)
注册时间:2006-03-29
最后登录:2008-08-07
|
Css不朽的经典—3D文字特效
效果: I+rHb<
P% fFMGpibkM 3D Text 5k)QjZo 以下是一个用了blur滤镜而另一个没用的叠加效果 cV\(Z6u ?T3zA2 Ttop.cn Ttop.cn }3E@]"<cVR !g
# Glass Text [
a:yKJ[ 这个是两个都用了alpha滤镜的效果 $5yH(Z[[ (dd+wx't Ttop.cnTtop.cn N7Kq$G2O
|_"JyGR2 Inner Shadow 5^<X:1J$ 这个是先用了一段白色的文字,再加了mask()滤镜,再用了shadow()滤镜,最后加入chroma()滤镜形成后一段字体,放在前一段文字的相对left: -200px位置上形成的。 9utiev~3 pM],-7UM Ttop.cnTtop.cn ELf cZfJ N:?UA Outline Text mk(O..)2 用mask, glow and chroma三个滤镜联合作用 W/!M
eTU&E -^LUa]"E Ttop.cn gqV66xmJ3 ZUePHI-dP 与Marquee的完美结合
"
!F)K www.Ttop.cnwww.Ttop.cn }(k#,&Fv` hsG~xRA\ 源代码: 3*)<Y}Tc Y )#x(s?t <style type="text/css"> Fa<>2KkOr <!-- wNo2$>* .sample -FQ! font-style: italic; font-family: arial black;font-size: 40px; font-weight: bold; cursor: hand; x\PZ.o '!eg9}< --> B7PkCS&X </style> wpgO09 <title>Css不朽的经典—3D文字特效</title> p]h;M <div> 9{
[I| <h2>3D Text</h2> Vw-,G7v&E <p>以下是一个用了blur滤镜而另一个没用的叠加效果</p> tfB}U. <p onClick="alert(this.innerHTML)"> <span class="sample" 0RHKzk6~c style="width: 200px; height: 70; color: black; filter: Blur(Add=0, Direction=135, Strength=10);" LLy w9y1 >Ttop.cn</span><span class="sample" ot\ FZ style="position: relative; left: -201; top: -15; width: 200; color: #2984ff;"> n/W@H Im# Ttop.cn</span> </p> +85#`{ D <h2>Glass Text</h2> d}D%%noIu <p>这个是两个都用了alpha滤镜的效果</p> k;5$]^x <p onClick="alert(this.innerHTML)"> <span class="sample" *vy^=Yea
style="width: 200px; height: 70; color: lightskyblue; filter: Alpha(Opacity=60) Blur(Add=0, Direction=135, Strength=20);" |Gp!#D0b >Ttop.cn</span><span class="sample" OBb m?`[ style="position: relative; left: -201; top: -15; width: 200; color: lightskyblue; filter: Alpha(Opacity=60);" v
C23 >Ttop.cn</span> </p> zM+4<k_dH] <h2>Inner Shadow</h2> pbCj
^
<p>这个是先用了一段白色的文字,再加了mask()滤镜,再用了shadow()滤镜,最后加入chroma()滤镜形成后一段字体,放在前一段文字的相对left: rX7GVg@H -200px位置上形成的。</p> ak,KHA6u <p onClick="alert(this.innerHTML)"> <span class="sample" .lsD+} style="width: 200px; height: 70; color: white;" T`?7z+2A >Ttop.cn</span><span class="sample" &}'FC7} style="width: 200px; height: 70; position: relative; left: -200; filter: mask(color=red) shadow(direction=135) chroma(color=red);" 1JQ5bB"
>Ttop.cn</span> </p> J#.f%VJ <h2>Outline Text</h2> 2xLEB& <p>用mask, glow and chroma三个滤镜联合作用</p> ` ~w|Xz <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> ai7R@~O:_k <h2>与Marquee的完美结合</h2> --fRh N> <p onClick="alert(this.innerHTML)"> <span class="sample" t1JU_
P style="width:320px; height: 70; color: black; filter: Blur(Add=0, Direction=135, Strength=10);" 1Clid\T,o ><marquee width:300 height:70 scrollamount="1" behavior="alternate" class="sample">www.Ttop.cn</marquee></span> reQr=OAez <span class="sample" tJG+k)EE style="position: relative; left: -320; top: -15; width: 320; color: #2984ff;"> mjQZ"h0 <marquee width:320 height:70 scrollamount="1" behavior="alternate" class="sample">www.Ttop.cn</marquee></span> </p> [psZc'q </div>
|
|
[楼 主]
|
Posted: 2006-04-05 09:03 |
| |