简单掌握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实现质感细腻丝滑按钮
Mar 09 HTML / CSS
纯CSS3实现表单验证效果(非常不错)
Jan 18 HTML / CSS
CSS3中的display:grid,网格布局介绍
Oct 30 HTML / CSS
html5+css3之制作header实例与更新
Dec 21 HTML / CSS
html5 乒乓球(碰撞检测)实例二
Jul 25 HTML / CSS
HTML5注册页面示例代码
Mar 27 HTML / CSS
浅谈html5 响应式布局
Dec 24 HTML / CSS
使用HTML5中的contentEditable来将多行文本自动增高
Mar 01 HTML / CSS
借助HTML5 Canvas API制作一个简单的猜字游戏
Mar 25 HTML / CSS
Html5新标签datalist实现输入框与后台数据库数据的动态匹配
May 18 HTML / CSS
HTML5 常见面试题之PC端和移动端区别介绍
Jan 22 HTML / CSS
CSS list-style-type属性使用方法
May 21 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图像处理类代码分享
2012/01/19 PHP
php实现图片上传并进行替换操作
2016/03/15 PHP
php pdo操作数据库示例
2017/03/10 PHP
laravel 5.1下php artisan migrate的使用注意事项总结
2017/06/07 PHP
Laravel关系模型指定条件查询方法
2019/10/10 PHP
超简单的jquery的AJAX用法
2010/05/10 Javascript
JavaScript 判断指定字符串是否为有效数字
2010/05/11 Javascript
jQuery函数的等价原生函数代码示例
2013/05/27 Javascript
asm.js使用示例代码
2013/11/28 Javascript
jquery插件jTimer(jquery定时器)使用方法
2013/12/23 Javascript
Nodejs的express使用教程
2015/11/23 NodeJs
基于chosen插件实现人员选择树搜索自动筛选功能
2016/09/24 Javascript
vue打包之后生成一个配置文件修改接口的方法
2018/12/09 Javascript
深入理解Node内建模块和对象
2019/03/12 Javascript
Vue实现PC端靠边悬浮球的代码
2020/05/09 Javascript
python ElementTree 基本读操作示例
2009/04/09 Python
Python过滤函数filter()使用自定义函数过滤序列实例
2014/08/26 Python
Python的爬虫包Beautiful Soup中用正则表达式来搜索
2016/01/20 Python
Python脚本处理空格的方法
2016/08/08 Python
简述:我为什么选择Python而不是Matlab和R语言
2017/11/14 Python
[原创]python爬虫(入门教程、视频教程)
2018/01/08 Python
Python查看微信撤回消息代码
2018/06/07 Python
关于numpy.where()函数 返回值的解释
2019/12/06 Python
如何使用PyCharm引入需要使用的包的方法
2020/09/22 Python
Python操作PostgreSql数据库的方法(基本的增删改查)
2020/12/29 Python
Java如何获得ResultSet的总行数
2016/09/03 面试题
网上签名寄语活动留言
2014/01/18 职场文书
致100米运动员广播稿
2014/02/14 职场文书
知识竞赛主持词
2014/03/26 职场文书
机电一体化专业毕业生自荐信
2014/06/19 职场文书
优秀应届本科生求职信
2014/07/19 职场文书
高中生思想道德自我评价
2015/03/09 职场文书
2016大学军训心得体会
2016/01/11 职场文书
写好Python代码的几条重要技巧
2021/05/21 Python
MySQL中distinct与group by之间的性能进行比较
2021/05/26 MySQL
Win11更新失败并提示0xc1900101
2022/04/19 数码科技