简单掌握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 选择器 伪类选择器介绍
Jan 21 HTML / CSS
CSS类名支持中文命名的示例
Apr 04 HTML / CSS
纯css3制作的火影忍者写轮眼开眼至轮回眼及进化过程实例
Nov 11 HTML / CSS
css3进阶之less实现星空动画的示例代码
Sep 10 HTML / CSS
HTML5文档结构标签
Apr 21 HTML / CSS
HTML5的标签的代码的简单介绍 HTML5标签的简介
May 28 HTML / CSS
举例详解HTML5中使用JSON格式提交表单
Jun 16 HTML / CSS
详解HTML5中的元素与元素
Aug 17 HTML / CSS
基于HTML5的齿轮动画特效
Feb 29 HTML / CSS
HTML5中indexedDB 数据库的使用实例
May 11 HTML / CSS
移动端开发HTML5页面点击按钮后出现闪烁或黑色背景的解决办法
Sep 19 HTML / CSS
HTML页面点击按钮关闭页面的多种方式
Dec 24 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令牌 Token改进版
2008/07/18 PHP
php使用正则表达式提取字符串中尖括号、小括号、中括号、大括号中的字符串
2020/04/05 PHP
一键生成各种尺寸Icon的php脚本(实例)
2017/02/08 PHP
HTML页面如何象ASP一样接受参数
2007/02/07 Javascript
JavaScript 保存数组到Cookie的代码
2010/04/14 Javascript
JSON.parse 解析字符串出错的解决方法
2010/07/08 Javascript
JS验证控制输入中英文字节长度(input、textarea等)具体实例
2013/06/21 Javascript
jquery.post用法关于type设置问题补充
2014/01/03 Javascript
plupload+artdialog实现多平台上传文件
2016/07/19 Javascript
JavaScript兼容性总结之获取非行间样式案例
2016/08/07 Javascript
js中遍历Map对象的简单实例
2016/08/08 Javascript
javascript基本数据类型及类型检测常用方法小结
2016/12/14 Javascript
AngularJS ng-repeat指令中使用track by子语句解决重复数据遍历错误问题
2017/01/21 Javascript
Node.js搭建小程序后台服务
2018/01/03 Javascript
vue router动态路由下让每个子路由都是独立组件的解决方案
2018/04/24 Javascript
Angularjs之如何在跨域请求中传输Cookie的方法
2018/06/01 Javascript
nodejs初始化init的示例代码
2018/10/10 NodeJs
Nodejs实现图片上传、压缩预览、定时删除功能
2019/10/25 NodeJs
解决VantUI popup 弹窗不弹出或无蒙层的问题
2020/11/03 Javascript
JavaScript实现滑块验证解锁
2021/01/07 Javascript
python 从远程服务器下载日志文件的程序
2013/02/10 Python
python实现在目录中查找指定文件的方法
2014/11/11 Python
pandas读取CSV文件时查看修改各列的数据类型格式
2019/07/07 Python
Python3通过chmod修改目录或文件权限的方法示例
2020/06/08 Python
Python爬虫逆向分析某云音乐加密参数的实例分析
2020/12/04 Python
详解CSS3中使用gradient实现渐变效果的方法
2015/08/18 HTML / CSS
英国著名的药妆网站:Escentual
2016/07/29 全球购物
Expedia丹麦:全球领先的旅游网站
2018/03/18 全球购物
护士演讲稿范文
2014/01/05 职场文书
公司员工检讨书
2014/02/08 职场文书
检讨书1000字
2014/10/11 职场文书
2015年乡镇平安建设工作总结
2015/05/13 职场文书
2016年八一建军节活动总结
2016/04/05 职场文书
经典励志格言:每日一句,让你每天充满能量
2019/08/16 职场文书
CSS3实现的文字弹出特效
2021/04/16 HTML / CSS
SpringBoot使用ip2region获取地理位置信息的方法
2022/06/21 Java/Android