CSS3 之text-fill-color属性

news/2024/12/21 20:30:03/

 

text-fill-color是设置指定文字的填充颜色。
若同时设置<text-fill-color > 和 <color >,
< text-fill-color >定义的颜色将覆盖< color > 属性
text-fill-color可以实现渐变色字体和镂空字体,具体如下:

渐变色字体

//HTML代码
<p class="font1">你好,这是我的渐变色字体</p>
//CSS代码
.font1{font-size:22px;background-image: -webkit-linear-gradient(bottom, rgb(201, 21, 134), rgb(20, 11, 255));-webkit-background-clip: text;-webkit-text-fill-color: transparent;

效果如下:

 

渐变字体

镂空字体

//HTML代码
<p class="font1">你好,这是我的镂空字体</p>
//CSS代码
.font1{font-size:32px;-webkit-text-fill-color: transparent;-webkit-text-stroke:1px #000;}

效果如下:

 


http://www.ppmy.cn/news/877589.html

相关文章

Color ui 官方网站不能进入

有没有铁铁知道为啥小程序组件库color ui的官方网站进不去了啊&#xff0c;或者有没有小伙伴有镜像网站或者官方说明文档的&#xff0c;今天用color ui写小程序官方网站突然就进不去了&#xff0c;我的网没问题&#xff0c;试了好多遍都是这个结果&#xff0c;换浏览器也不行。…

on the fly

读文献看到一篇文章&#xff0c;However, since our model only uses convolutional and pooling layers it can be resized on the fly. 什么在空中&#xff0c;哈哈&#xff0c;&#xff1f;肯定不对&#xff0c;搜一搜。 结果如下&#xff1a; 几乎每篇文档都给你来一个o…

colorkey唇釉是否安全_colorkey唇釉

口红控的女生们想必不会放过任何一个口红上新的机会~而之前因为李佳琦的大力推荐&#xff0c;colorkey唇釉也就频繁出现在我们面前了&#xff0c;小编也跟风买了几根&#xff0c;今天就来给大家说说colorkey唇釉是使用感及质量吧&#xff01; colorkey唇釉适合肤质 所有肤质。 …

Coloring

Coloring 程度★ 難度★ Coloring 替一張圖的各個元件都塗上顏色&#xff0c;並規定相鄰元件不可同色。一張圖的上色情形&#xff0c;稱做一種「著色」。 根據元件的不同&#xff0c;著色可分為許多種類型&#xff0c;例如點著色&#xff08; vertex coloring &#xff09;、邊…

Colorfly参考级旗舰播放器Pocket HiFi U8即将开售

作为时隔8年&#xff0c;继C4之后重磅上市的品牌旗舰播放器&#xff0c;Pocket HiFi U8集成了四项Colorfly品牌的当家科技&#xff1a;AMPT内存播放技术、Smart VolumeⅠ技术、模拟开关阵列技术以及在上代旗舰C4中备受好评的Jitterkill Ⅱ技术。四项“黑科技”加持&#xff0c;…

20-认识RGB七彩灯 | Mixly技巧系列

Mixly 是由北师大米思齐团队开发的图形化编程软件&#xff0c;自发布以来深受国内创客圈的喜爱。Mixly 编程软件采用图形化编程&#xff0c;不用记代码&#xff0c;只需要拖拽、简单设置&#xff0c;就能让你快速完成创意电子编程。本专栏系列课程由裘炯涛老师主讲&#xff0c;…

Flutter Color的使用

Flutter 系列文章 总体目录 4种定义Color的方式&#xff1a; Color c const Color(0xFF42A5F5);//16进制的ARGB Color c const Color.fromARGB(0xFF, 0x42, 0xA5, 0xF5); Color c const Color.fromARGB(255, 66, 165, 245); Color c const Color.fromRGBO(66, 165, 245, …

开源 Cocos Creator 3.x 游戏框架 oops-framework

oops-framework 介绍 oops-framework 基于 Cocos Creato 3.x 开发的一款游戏框架 提供游戏常用功能库&#xff0c;提高开发效率提供业务模块开发的模板&#xff0c;降低程序设计难度框架内置模块低耦合&#xff0c;可自行删除不需要的模块 框架使用说明 框架里的技术内容是…