开发者学堂课程【CSS 快速掌握:文本阴影 】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/611/detail/9208
文本阴影
内容介绍
一、text-shadow
一、text-shadow
text-shadow:水平阴影 垂直阴影 模糊距离 阴影颜色。
注释: text-shadow 属性向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表,每个阴影有两个或三个长度值和一个可选的颜色值进行规定。省略的长度是0。
描述:
●文字阴影可以有多组值,多组之间用逗号隔开就可以。
●水平阴影正值阴影在右边,负值在左边。
●垂直阴影正值在下边,负值在上边。
●模糊强度,值越大越模糊。
例子
< !DOCTYPE html>
</span></code><code><span class="lake-fontsize-1515">文本阴影<span>
.box{
font-size: 40px ;
font-family: "
楷体";
color: #32CD32;
/*
给文本设置阴影
text-shadow:
水平阴影 垂直阴影 模糊的距离 阴影的颜色
*/
text-shadow: 3px 3px 3px #CD5C5C ;
}
< body>
例子
color: #32CD32 ;
/*
给文本设置阴影
text-shadow:
水平阴影 垂直阴影 模糊的距离 阴影的颜色
*/
text-shadow: 3px 3px 3px #CD5C5C ;
}
.box_ two{
font-size: 50px;
font-family: "
隶书";
color: #9932CC ;
/*
给文本设置阴影
text-shadow:
水平阴影 垂直阴影 模糊的距离 阴影的颜色*/
text-shadow: 4px 2px 2px #8B8682,-4px -4px 3px #FF1493;
}
黑马程序员