html字体颜色渐变 您所在的位置:网站首页 h1标签字体颜色 html字体颜色渐变

html字体颜色渐变

2023-08-29 16:25| 来源: 网络整理| 查看: 265

效果图:

 样式

.style1{ background: linear-gradient(to bottom,#f0610e, #e8771a, #fff34a); -webkit-background-clip: text; color: transparent; } .style2{ background: linear-gradient(to right,#f0610e, #e8771a, #fff34a); -webkit-background-clip: text; color: transparent; }

注:color: transparent,设置原字体颜色为透明,

       -webkit-background-clip: text,文本渐变          

linear-gradient() 函数   

        从上到下,蓝色渐变到红色 */ linear-gradient(45deg, blue, red);

        渐变轴为45度,从蓝色渐变到红色 */ linear-gradient(45deg, blue, red);

        从右下到左上、从蓝色渐变到红色 */ linear-gradient(to left top, blue, red);

        从下到上,从蓝色开始渐变、到高度40%位置是绿色渐变开始、最后以红色结束 */ linear-gradient(0deg, blue, green 40%, red);

源代码

从上到下 从左到右

 



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

      专题文章
        CopyRight 2018-2019 实验室设备网 版权所有