【每日一练】85- CSS分层彩色文本效果生成器的实现
写在前面
关于文本效果的练习，我们在前面也分享了不少，今天我们再来练习一个CSS实现的彩色文本效果生成器，它的最终效果如下：
我们看完了这个效果的最终介绍，我们再来看一下，它的代码实现过程。
HTML代码：
<htm>
<head>
<meta charset="UTF-8">
<title>【每日一练】85- CSS分层文本阴影效果生成器的实现</title>
</head>
<body>
<div>web前端开发</div>
<p>web前端开发博客网站:
<a href="https://www.webqdkf.com/">www.webqdkf.com</a>
</p>
</body>
</htm>
CSS代码：
div{
font-size: 15rem;
text-align: center;
height:90vh;
line-height: 90vh;
color: #fcedd8;
background: #d52e3f;
font-family: 微软雅黑;
font-weight: 700;
text-shadow:
5px 5px 0px #eb452b,
10px 10px 0px #efa032,
15px 15px 0px #46b59b,
20px 20px 0px #017e7f,
25px 25px 0px #052939,
30px 30px 0px #c11a2b,
35px 35px 0px #c11a2b,
40px 40px 0px #c11a2b,
45px 45px 0px #c11a2b;
}
p{
text-align: center;
font-family: "Helvetica";
font-size:0.8rem;
}
a{
color: #d52e3f;
text-decoration: none;
font-family: Niconne, cursive;
font-size: 1.2rem;
}
写在最后
我是杨小爱，我们明天见。
学习更多技能
写在前面 关于文本效果的练习，我们在前面也分享了不少，今天我们再来练习一个CSS实现的彩色文本效果生成器，它的最终效果如下： 我们看完了这个效果的最终介绍，我们再来看一下，它的代码实现过程。 HTML代码：
web前端开发
web前端开发博客网站: www.webqdkf.com
