本文摘自PHP中文网，作者奋力向前，侵删。
之前的文章《CSS篇：如何将页面背景设置渐变效果（代码详解）》中，给大家介绍了怎样使用css设置背景色渐变。下面本篇文章给大家介绍怎样使用css3给文字添加阴影效果呢，我们一起看看怎么做。
用css3给文字添加阴影效果代码示例
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文字阴影</title>
<style>
h1
{text-shadow: 7px 10px 6px #FF0145;}
p
{text-shadow: 5px 5px 5px #FF0000;}
p1
{text-shadow: 5px 5px 5px #FF4780;}
</style>
</head>
<body>
<h1>php中文网</h1>
<p>php中文网</p>
<p1>文字阴影</p1>
</body>
</html>
|
代码运行效果图
阅读剩余部分
相关阅读 >>
css怎么设置无边框
css中如何使用@规则？用法介绍
css文字在底部怎么写
纯css实现加号“+”效果（代码示例）
css如何引入字体文件
css可以去掉浮动吗？
css如何取消下划线
css文件中引用图片不显示怎么办
vue组件中如何引入css文件
css3怎么实现圆角
更多相关阅读请进入《css》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
转载请注明出处：木庄网络博客 » 手把手教你使用css3给文字添加阴影效果（代码详解）
