我以前使用过很多%ign%ignore_a_1%re_a_1%3属性，但很快就忘记了，因为其中很多属性很难记住，所以我想写博客来方便记住它们。
所以让我先解释一下线渐变：
背景图像：线性渐变（方向，颜色步骤1，颜色步骤2，……）
direction：使用angle表示渐变方向，其值可以是角度或其中之一：向左、向右、向上、向下。到底部（180 度）是默认值。color-step：渐变的起始颜色，由两部分组成： color：有效的 css 颜色值；长度或百分比：起始位置，不允许负值
示例（假设高度：100px）
背景：线性渐变（到底部，红色0％，黄色50％，绿色100％）；与背景相同：线性渐变（180deg，红色0px，黄色50px，绿色100px）;
repeatng-linear-gradient(): 背景: 重复线性渐变(红 0,红 10%,黄 10%,黄 20%);
这些参数代表从红色到红色的 0% – 10%，从黄色到黄色的 10% – 20%，并重复此效果以覆盖整个元素大小。
径向渐变()
该函数参数由五部分组成：形状、大小、圆心位置、颜色、颜色位置。
形状：椭圆形（默认）或圆形；尺寸：我更喜欢将其称为径向渐变半径增加的方向，可能的值：最远角（默认）、最近角、最远侧、最近侧。position：径向渐变的中心位置，默认为(50%, 50%)；颜色和颜色位置：与线性渐变相同；
这个效果是中心位置位于(0,0)，渐变半径等于元素的宽度；
并且repeating-radial-gradient() 与repeating-linear-gradient() 相同。
最后，线性渐变和辐射渐变的兼容性（更多关于CanIuse网站）
无涯·问知
无涯·问知，是一款基于星环大模型底座，结合个人知识库、企业知识库、法律法规、财经等多种知识源的企业级垂直领域问答产品
153 查看详情 
立即学习“前端免费学习笔记（深入）”；
以上就是CSS线性渐变和径向渐变的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1151149.html
微信扫一扫 
支付宝扫一扫 
