 |
位置：电子教程 > CSS3教程 (如果看不到内容请使用360浏览器) | 推荐学习资源 |
|
位置：电子教程 > CSS3教程 (如果看不到内容请使用360浏览器) | 推荐学习资源 |
| 当前阅读教程：CSS3教程 > text-shadow 文本阴影 | |||||||||||||||||||
| 阅读(22555525) 收藏 赞(5685) 分享 | |||||||||||||||||||
| 上一篇： text-overflow 属性 | 下一篇： word-break 属性 | ||||||||||||||||||
浏览器支持表格中的数字表示支持该属性的第一个浏览器版本号。
属性定义及使用说明text-shadow 属性应用于阴影文本。
语法text-shadow: h-shadow v-shadow blur color; 注意： text-shadow属性连接一个或更多的阴影文本。属性是阴影，指定的每2或3个长度值和一个可选的颜色值用逗号分隔开来。已失时效的长度为0。
示例代码<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>文本阴影 text-shadow</title>
<!--定义内部样式-->
<style>
.css01{
text-shadow:2px 2px 8px #FF0000;/*文字阴影模糊效果*/
}
.css02{
color:white;/*白色*/
text-shadow:2px 2px 4px #000000;/*文字阴影*/
}
.css03{
text-shadow:0 0 3px #FF0000; /*霓虹灯的光芒文字阴影*/
}
</style>
</head>
<body>
<!--没有缩进-->
<h2>
没有任何效果的字体
</h2>
<h2>
文字阴影模糊效果
</h2>
<h2>
白色文字上的文字阴影
</h2>
<h2>
霓虹灯的光芒文字阴影
</h2>
</body>
</html>效果图
|
|||||||||||||||||||
| 上一篇： text-overflow 属性 | 下一篇： word-break 属性 | ||||||||||||||||||
