text-emphasis-color

Baseline 已广泛支持

此特性已经十分成熟,可在许多设备和浏览器版本上使用。自 2022 年 3 月起,它已在各浏览器中可用。

text-emphasis-color CSS 属性设置着重号的颜色。此值也可以使用 text-emphasis 简写属性来设置。

试一试

text-emphasis-color: currentColor;
text-emphasis-color: red;
text-emphasis-color: rgb(90 200 160 / 0.8);
<section id="default-example">
  <p>
    I'd far rather be
    <span class="transition-all" id="example-element">happy than right</span>
    any day.
  </p>
</section>
p {
  font: 1.5em sans-serif;
}

#example-element {
  text-emphasis: filled;
}

语法

css
/* Initial value */
text-emphasis-color: currentColor;

/* <color> */
text-emphasis-color: #555555;
text-emphasis-color: blue;
text-emphasis-color: rgb(90 200 160 / 80%);
text-emphasis-color: transparent;

/* Global values */
text-emphasis-color: inherit;
text-emphasis-color: initial;
text-emphasis-color: revert;
text-emphasis-color: revert-layer;
text-emphasis-color: unset;

<color>

定义着重号的颜色。如果未指定颜色,则默认为 currentColor

正式定义

初始值currentcolor
应用于所有元素
继承性
计算值computed color
动画类型一种颜色

正式语法

text-emphasis-color = 
<color>

示例

带有颜色和自定义字符的着重号

CSS

css
em {
  text-emphasis-color: green;
  text-emphasis-style: "*";
}

HTML

html
<p>Here's an example:</p>

<em>This has emphasis marks!</em>

结果

规范

规范
CSS 文本装饰模块级别 3
# text-emphasis-color 属性

浏览器兼容性

另见