1.text-fill-color和color都是填充字体颜色,text-fill-color权重高于color,如果一个css同时有这两个属性,text-fill-color会覆盖color的颜色,下面是案例:
h1{-webkit-text-fill-color: red;color: blue;}
h1的color颜色为蓝色,text-fill-color为红色,我们看看最后浏览器怎么渲染的:

所以说,text-fill-color权重高于color
2.text-stroke:描边宽度,颜色。案例如下:
h2{-webkit-text-stroke:1px coral;color: transparent;}
效果如下:

注意:text-fill-color和text-stroke都是引用svg的方法,所以css使用建议都加-webkit,提高浏览器的支持率,放心用吧,浏览器很给力!

本文深入探讨了CSS中text-fill-color和color属性的使用及权重差异,解释了text-fill-color为何能覆盖color,并通过实例展示了text-stroke属性的描边效果。强调了-webkit前缀在提高浏览器兼容性方面的作用。
556

被折叠的 条评论
为什么被折叠?



