-webkit-text-stroke-color

非标准

此功能是非标准的。不要在面向Web的生产站点上使用它：它并不适用于每个用户。实现之间也可能存在很大的不兼容性，而且这种行为在未来可能会发生变化。

该-webkit-text-stroke-colorCSS属性指定的文本字符的笔画颜色。如果此属性未设置，color则使用该属性的值。

/* <color> values */
-webkit-text-stroke-color: red;
-webkit-text-stroke-color: #e08ab4;
-webkit-text-stroke-color: rgb(200, 100, 0

/* Global values */
-webkit-text-stroke-color: inherit;
-webkit-text-stroke-color: initial;
-webkit-text-stroke-color: unset;

初始值	currentcolor
适用元素	all elements
是否是继承属性	yes
适用媒体	visual
计算值	computed color
动画类型	a color
正规顺序	the unique non-ambiguous order defined by the formal grammar

语法

值

<color>笔画的颜色。

正式语法

<color>where 
<color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>
where 
<rgb()> = rgb( [ [ <percentage>{3} | <number>{3} ] [ / <alpha-value> ]? ] | [ [ <percentage>#{3} | <number>#{3} ] , <alpha-value>? ] )
<rgba()> = rgba( [ [ <percentage>{3} | <number>{3} ] [ / <alpha-value> ]? ] | [ [ <percentage>#{3} | <number>#{3} ] , <alpha-value>? ] )
<hsl()> = hsl( [ <hue> <percentage> <percentage> [ / <alpha-value> ]? ] | [ <hue>, <percentage>, <percentage>, <alpha-value>? ] )
<hsla()> = hsla( [ <hue> <percentage> <percentage> [ / <alpha-value> ]? ] | [ <hue>, <percentage>, <percentage>, <alpha-value>? ] )
where 
<alpha-value> = <number> | <percentage>
<hue> = <number> | <angle>

示例

HTML内容

<p>Text with stroke</p>
<input type="color" value="#ff0000">

CSS内容

p {
  margin: 0;
  font-size: 4em;
  -webkit-text-stroke-width: 3px;
  -webkit-text-stroke-color: #ff0000; /* Can be changed in the live sample */
}

规范

Specification	Status	Comment
Compatibility StandardThe definition of '-webkit-text-stroke-color' in that specification.	Living Standard	Initial standardization
Safari CSS Reference '-webkit-text-stroke-color' in that document.	Non-standard unofficial documentation	Initial documentation

不是任何规范的一部分。

Apple 在Safari CSS参考中对-webkit-text-stroke-color有一个描述。

浏览器兼容性

Feature	Chrome	Edge	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic support	(Yes)	(Yes)	48.0 (48.0)1	No support	(Yes)	(Yes)

Feature	Android	Edge	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support	?	(Yes)	48.0 (48.0)1	No support	?	?