-webkit-text-stroke
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2017年4月.
CSS 属性 -webkit-text-stroke 指定了文本字符的笔触宽度和笔触颜色。此属性为全称属性 -webkit-text-stroke-width 和 -webkit-text-stroke-color 的简写属性。
css
/* 宽度和颜色值 */
-webkit-text-stroke: 4px navy;
text-stroke: 4px navy;
/* 全局值 */
-webkit-text-stroke: inherit;
-webkit-text-stroke: initial;
-webkit-text-stroke: revert;
-webkit-text-stroke: revert-layer;
-webkit-text-stroke: unset;
属性构成
此属性为下列 CSS 属性的简写属性：
语法
取值
形式定义
| 初始值 | 该简写所对应的每个属性：
|
|---|---|
| 适用元素 | 所有元素 |
| 是否是继承属性 | 是 |
| 计算值 | 该简写所对应的每个属性： |
| 动画类型 | 该简写所对应的每个属性： |
形式语法
-webkit-text-stroke =
<line-width> ||
<color>
<line-width> =
<length [0,∞]> |
thin |
medium |
thick
示例
添加红色文本笔触
HTML
html
<p id="example">此文本的笔触为红色的。</p>
CSS
css
#example {
font-size: 3em;
margin: 0;
-webkit-text-stroke: 2px red;
}
结果
规范
| Specification |
|---|
| Compatibility # the-webkit-text-stroke |
浏览器兼容性
Loading…