简单掌握CSS3将文字描边及填充文字颜色的方法


Posted in HTML / CSS onMarch 07, 2016

text-stroke文字描边
语法:

CSS Code复制内容到剪贴板
  1. text-stroke:<text-stroke-width> <text-stroke-color>  

想象一个红色描边的文字:
代码

CSS Code复制内容到剪贴板
  1. text-stroke: 1px #f00;  

效果
简单掌握CSS3将文字描边及填充文字颜色的方法

text-stroke是符合属性,可以分拆为text-stroke-width和text-stroke-color两个属性

text-fill-color文字填充
语法:

CSS Code复制内容到剪贴板
  1. text-fill-color:<color>  

text-fill-color会覆盖color所定义的字体颜色:

CSS Code复制内容到剪贴板
  1. text-fill-color:#f00;   
  2. color:#000;  

效果
简单掌握CSS3将文字描边及填充文字颜色的方法

在webkit下你将看到红色的文字

HTML / CSS 相关文章推荐
纯CSS3实现3D旋转书本效果
Mar 21 HTML / CSS
五款漂亮的纯CSS3动画按钮的实例教程
Nov 21 HTML / CSS
CSS3制作炫酷的自定义发光文字
Mar 28 HTML / CSS
css3通过scale()、rotate()实现放大、旋转
Mar 19 HTML / CSS
CSS 说明横向进度条最后显示文字的实现代码
Nov 10 HTML / CSS
使用HTML5捕捉音频与视频信息概述及实例
Aug 22 HTML / CSS
HTML5计时器小例子
Oct 15 HTML / CSS
详解如何获取localStorage最大存储大小的方法
May 21 HTML / CSS
HTML5播放实现rtmp流直播
Jun 16 HTML / CSS
Html5基于canvas实现电子签名并生成PDF文档
Dec 07 HTML / CSS
CSS3 Tab动画实例之背景切换动态效果
Aug 23 HTML / CSS
HTML常用标签超详细整理
Mar 19 HTML / CSS
CSS3中文字镂空、透明值、阴影效果设置示例小结
Mar 07 #HTML / CSS
利用CSS的Sass预处理器(框架)来制作居中效果
Mar 10 #HTML / CSS
全面总结使用CSS实现水平垂直居中效果的方法
Mar 10 #HTML / CSS
纯CSS3实现3D旋转书本效果
Mar 21 #HTML / CSS
CSS3实现粒子旋转伸缩加载动画
Apr 22 #HTML / CSS
一款利用html5和css3实现的3D立方体旋转效果教程
Apr 26 #HTML / CSS
CSS3弹性盒模型开发笔记(一)
Apr 26 #HTML / CSS
You might like
php 远程图片保存到本地的函数类
2008/12/08 PHP
2款PHP无限级分类实例代码
2015/11/11 PHP
PHP中的数组处理函数实例总结
2016/01/09 PHP
php实现购物车产品删除功能(2)
2020/07/23 PHP
php的优点总结 php有哪些优点
2019/07/19 PHP
用JQuery模仿淘宝的图片放大镜显示效果
2011/09/15 Javascript
JS解决url传值出现中文乱码的另类办法
2013/04/08 Javascript
Javascript闭包实例详解
2015/11/29 Javascript
第四章之BootStrap表单与图片
2016/04/25 Javascript
JavaScript判断浏览器对CSS3属性是否支持的多种方法
2016/11/13 Javascript
jquery dataview数据视图插件使用方法
2016/12/23 Javascript
node.js实现复制文本到剪切板的功能
2017/01/23 Javascript
详解微信小程序 登录获取unionid
2017/06/27 Javascript
JS实现获取word文档内容并输出显示到html页面示例
2018/06/23 Javascript
Vue表单及表单绑定方法
2018/09/04 Javascript
JavaScript模板引擎原理与用法详解
2018/12/24 Javascript
记一次用vue做的活动页的方法步骤
2019/04/11 Javascript
vue+layui实现select动态加载后台数据的例子
2019/09/20 Javascript
JavaScript实现网页tab栏效果制作
2020/11/20 Javascript
[45:25]OG vs EG 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.22
2019/09/05 DOTA
Python内置函数——__import__ 的使用方法
2017/11/24 Python
PyQt5每天必学之布局管理
2018/04/19 Python
Python 转换文本编码实现解析
2019/08/27 Python
Python常用模块logging——日志输出功能(示例代码)
2019/11/20 Python
python实现对变位词的判断方法
2020/04/05 Python
Tensorflow tf.nn.depthwise_conv2d如何实现深度卷积的
2020/04/20 Python
Python+pyftpdlib实现局域网文件互传
2020/08/24 Python
Pyside2中嵌入Matplotlib的绘图的实现
2021/02/22 Python
html5 input属性使用示例
2013/06/28 HTML / CSS
新西兰演唱会和体育门票网站:Ticketmaster新西兰
2017/10/07 全球购物
人力资源部经理助理岗位职责
2014/03/04 职场文书
交通事故私了协议书
2014/04/16 职场文书
停电放假通知
2015/04/14 职场文书
撤诉申请书法院范本
2015/05/18 职场文书
2019年市场部个人述职报告(三篇)
2019/10/23 职场文书
Oracle 数据仓库ETL技术之多表插入语句的示例详解
2021/04/12 Oracle