博客园  :: 首页  :: 新随笔  :: 订阅 订阅  :: 管理

CSS3字体阴影演示

Posted on 2011-10-21 09:27  PHP-张工  阅读(4121)  评论(0编辑  收藏  举报

请使用CHROME浏览器查看

ABC123文字测试
ABC123文字测试
ABC123文字测试
ABC123文字测试

代码:

<div style="background-color: #535353; color: #353535; font-family: 微软雅黑; font-size: 64px; padding:20px; font-weight:bold;">
<span style="text-shadow: -2px -2px 2px #0D0D0D, 0px 0px 5px #aaa;">ABC123文字测试</span><br>
<span style="text-shadow: 2px 2px 2px #0D0D0D, 0px 0px 5px #aaa;">ABC123文字测试</span><br>
<span style="text-shadow: 2px 2px 2px #000, 0px 0px 10px #fff, 0px 0px 20px #fff;">ABC123文字测试</span><br>
<span style="color: white; text-shadow: 0px 0px 10px #fff, 0px 0px 20px #fff, 0px 0px 40px #9dd;">ABC123文字测试</span>
</div>