css3-11 如何设置文字的阴影
2024-10-01 21:55:23
css3-11 如何设置文字的阴影
一、总结
一句话总结:text-shadow属性。text-shadow:3px 3px 3px #f0f;
1、text-shadow属性的参数依次是什么意思?
水平及垂直偏移
模糊距离(这个参数相当于ps里面的羽化半径)
颜色
2、所有阴影类的属性必备的三个属性是什么(带上颜色是四个)?
水平及垂直偏移
模糊距离(这个参数相当于ps里面的羽化半径)
二、如何设置文字的阴影
1、相关知识
文本样式:
1.text-shadow
text-shadow:3px 3px 3px #f0f;
1.text-shadow
text-shadow:3px 3px 3px #f0f;
语法
text-shadow: h-shadow v-shadow blur color;
注释:text-shadow 属性向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表,每个阴影有两个或三个长度值和一个可选的颜色值进行规定。省略的长度是 0。
值 | 描述 | 测试 |
---|---|---|
h-shadow | 必需。水平阴影的位置。允许负值。 | 测试 |
v-shadow | 必需。垂直阴影的位置。允许负值。 | 测试 |
blur | 可选。模糊的距离。 | 测试 |
color | 可选。阴影的颜色。参阅 CSS 颜色值。 | 测试 |
2、代码
文字的阴影
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<style>
*{
font-family: 微软雅黑;
} p{
text-shadow:3px 3px 3px #00f;
}
</style>
</head>
<body>
<div>
<p>linux is very much!</p>
<p>linux is very much!</p>
<p>linux is very much!</p>
<p>linux is very much!</p>
<p>linux is very much!</p>
</div>
</body>
</html>
最新文章
- jquery checkbox反复调用attr(&#39;checked&#39;, true/false)只有第一次生效
- Ecshop的购物流程代码分析详细说明
- 最小二乘法 java
- SQL 实现,如果存在就更新,如果不存在就添加
- C#索引器及示例
- 编码,加解密,签名,Hash
- javascript-智能社-JS基础A笔记
- AD10 gerber生成,及导入cam350 多图详细步骤
- Topological Sorting
- |,&;,<;<;,>;>;运算符
- ssh-copy-id -i ~/.ssh/id_rsa.pub admin@172.17.42.66
- 【BZOJ1007】水平可见直线(单调栈)
- [转]MS Excel VBO option missing in Blue Prism
- Red hat查找命令所属的rpm包
- poj 2229 Sumsets(记录结果再利用的DP)
- python环境问题(pycharm)
- 8.15 自定义tr行 滚动 信息行的滚动
- 教程 | 一文入门Python数据分析库Pandas
- jquery获取下拉框中的循环值
- CSS 兼容iPhone X、iPhone XS及iPhone XR