CSS3文字阴影属性制作凹凸文字效果
<body>
<div class="box">我是凸出来的文字</div>
<div class="box">我是凹进去的文字</div>
</body>
<style>
.box {
width: 1000px;
height: 200px;
background-color: grey;
margin: 8px auto;
color: grey;
font-size: 80px;
text-align: center;
line-height: 200px;
}
.box:nth-child(1) {
text-shadow: -1px -1px 2px #000,
1px 1px 2px #fff;
}
.box:nth-child(2) {
text-shadow: -1px -1px 2px #fff,
1px 1px 2px #000;
}
</style>