CSS 文字加阴影变3D效果演示

<title>几款CSS给文字加阴影变3D效果演示</title> 
<style type="text/css"> 
 
</style> 
<div class="webfx-main-body"> 
<p onclick="alert(this.innerHTML)"> 
<span class="sample" 
style="width: 200px; height: 70; color: black; filter: Blur(Add=0, Direction=135, Strength=10);" 
>phpStudy</span><span class="sample" 
style="position: relative; left: -201; top: -15; width: 200; color: #2984ff;"> 
phpStudy</span> 
<p onclick="alert(this.innerHTML)"> 
<span class="sample" 
style="width: 200px; height: 70; color: lightskyblue; filter: Alpha(Opacity=60) Blur(Add=0, Direction=135, Strength=20);" 
>WebFX</span><span class="sample" 
style="position: relative; left: -201; top: -15; width: 200; color: lightskyblue; filter: Alpha(Opacity=60);" 
>phpStudy</span> 
<p onclick="alert(this.innerHTML)"> 
<span class="sample" 
style="width: 200px; height: 70; color: white;" 
>phpStudy</span><span class="sample" 
style="width: 200px; height: 70; position: relative; left: -200; filter: mask(color=red) shadow(direction=135) chroma(color=red);" 
>phpStudy</span> 
<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);">phpStudy</span> 
</div>

提示：您可以先修改部分代码再运行

«
»

PHP教程

PHP简介 PHP基本语法 PHP类型 PHP变量 PHP运算符 PHP控制结构 PHP函数 PHP类与对象 PHP异常处理函数库分类