本文摘自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 padding属性怎么用
css3绘制一个圆圆的loading转圈动画实例分享
css如何让图片旋转
css 图像不重复怎么设置
为什么外接css不起作用
css margin属性怎么用
background-position属性怎么用
html+css实现网页滑动门效果实例分享
更多相关阅读请进入《css》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » 手把手教你使用css3给文字添加阴影效果(代码详解)