text-shadow,可分别设置偏移量、模糊度、颜色(可设透明度)。
1、水平偏移量 正值向右 负值向左;
2、垂直偏移量 正值向下 负值向上;
3、模糊度是不能为负值;
4、可以设置多个阴影,每个阴影之间使用逗号隔开.
注意:可以有多个影子.
案例:凹凸文字效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>凹凸文字效果</title>
<style>
body{
background-color: #666;
}
p{
font-size:80px;
text-align: center;
font-weight: bold;
font-family: "Microsoft Yahei";
color:#666;
}
.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="ao">小宁博客--孙肖宁的个人博客</p>
<p class="tu">小宁博客--孙肖宁的个人博客</p>
</body>
</html>