CSS3 的text-shadow实现立体文字和燃烧文字
来源：互联网 发布：中原工学院软件怎么样? 编辑：程序博客网 时间：2024/05/15 09:53
立体文字演示效果如下：
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
p{
text-align: center;
background: #CCC;
font-size: 40px;
font-weight: bold;
color: #D1D1D1;
text-shadow: -2px -2px white,
2px 2px #333;
}
</style>
</head>
<body>
<p>html5 + css3</p>
</body>
</html>
燃烧效果如下：
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
body{
background: #000;
}
p{
text-align: center;
font-size: 40px;
font-weight: bold;
color: red;
text-shadow: 0 0 4px white,
0 -5px 4px #ff3,
2px -10px 6px #fd6,
-2px -15px 11px #f80,
2px -25px 18px #f20;
}
</style>
</head>
<body>
<p>html5 + css3</p>
</body>
</html>
- CSS3 的text-shadow实现立体文字和燃烧文字
- CSS3的文字阴影—text-shadow
- CSS3的文字阴影—text-shadow
- CSS3的文字阴影—text-shadow
- CSS3的文字阴影—text-shadow
- CSS3的文字阴影—text-shadow
- CSS3的文字阴影—text-shadow
- CSS3的文字阴影—Text-Shadow
- CSS3的文字阴影—text-shadow
- CSS3的文字阴影—text-shadow
- CSS3的文字阴影—text-shadow
- CSS3属性之text-shadow和box-shadow（立体效果的实现）
- css3新功能之(text-shadow实现)CSS3文字阴影效果
- 了解CSS3的文字阴影效果 - Text Shadow effects
- CSS3之文字阴影text-shadow
- CSS3之阴影-文字阴影text-shadow
- CSS3 参考指南：文字阴影text-shadow
- CSS3立体文字
- map容器的insert用法总结
- Java中的list集合
- java学习笔记（十七）
- C C++编程产生指定范围内的随机数
- DCOS管理平台Angularjs构建记(一)
- CSS3 的text-shadow实现立体文字和燃烧文字
- HDOJ/HDU 2539 点球大战(String.endsWith()方法的一个应用~)
- 笔试题53. LeetCode OJ (40)
- HandlerInterceptorAdapter
- fedoraXX 下载镜像地址
- oldlinux 新老论坛索引对照表
- hdu 1241 Oil Deposits(DFS)
- 那些年，在nodejs上踩过的坑
- 八大排序之冒泡排序
