<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>$美少女战士$</title>
<style>
body {
background-color: #808080;
}
div {
width: 600px;
height: 300px;
text-align: center;
line-height: 300px;
font-size: 80px;
font-weight: 900;
color: #808080; /*文字颜色必须和背景同色*/
}
.tu {
/* text-shadow: 右下 +, 左上-;*/
text-shadow: 1px 1px 1px #000,-1px -1px 1px #fff;
}
.ao {
text-shadow: 1px 1px 1px #fff,-1px -1px 1px #000;
}
</style>
</head>
<body>
<div class="tu">我是凸起来</div>
<div class="ao">我是凹下去</div>
</body>
</html>
html/css文字的凸起与凹陷效果
猜你喜欢
转载自blog.csdn.net/YPL_ZML/article/details/88879454
今日推荐
周排行