text-emphasis
text-emphasis CSS 属性用于给文本（空格和控制字符除外）应用着重号。它是 text-emphasis-style 和 text-emphasis-color 的简写属性。
试一试
text-emphasis: none;
text-emphasis: filled red;
text-emphasis: "x";
text-emphasis: filled double-circle #ffb703;
<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;
}
text-emphasis 属性与 text-decoration 有很大的不同。text-decoration 属性不继承，并且指定的装饰应用于整个元素。然而，text-emphasis 是继承的，这意味着可以更改后代元素的着重号。
着重号符号的大小（类似于 Ruby 符号）大约是字体大小的 50%，当当前行高不足以容纳这些符号时，text-emphasis 可能会影响行高。
注意： text-emphasis 不会重置 text-emphasis-position 的值。这是因为如果着重号的样式和颜色在文本中可能会有所不同，它们的定位极不可能发生变化。在极少数需要此功能的情况下，请使用属性 text-emphasis-position。
构成属性
此属性是以下 CSS 属性的简写：
语法
/* Initial value */
text-emphasis: none; /* No emphasis marks */
/* <string> value */
text-emphasis: "x";
text-emphasis: "点";
text-emphasis: "\25B2";
text-emphasis: "*" #555555;
text-emphasis: "foo"; /* Should NOT use. It may be computed to or rendered as 'f' only */
/* Keywords value */
text-emphasis: filled;
text-emphasis: open;
text-emphasis: filled sesame;
text-emphasis: open sesame;
/* Keywords value combined with a color */
text-emphasis: filled sesame #555555;
/* Global values */
text-emphasis: inherit;
text-emphasis: initial;
text-emphasis: revert;
text-emphasis: revert-layer;
text-emphasis: unset;
值
none-
无着重号。
filled-
形状被实心颜色填充。如果
filled和open都不存在，则这是默认值。 open-
形状是空心的。
dot-
显示小圆圈作为标记。实心圆点是
'•'(U+2022)，空心圆点是'◦'(U+25E6)。 circle-
显示大圆圈作为标记。实心圆圈是
'●'(U+25CF)，空心圆圈是'○'(U+25CB)。当未给出其他形状时，这是水平书写模式下的默认形状。 double-circle-
显示双圆圈作为标记。实心双圆圈是
'◉'(U+25C9)，空心双圆圈是'◎'(U+25CE)。 triangle-
显示三角形作为标记。实心三角形是
'▲'(U+25B2)，空心三角形是'△'(U+25B3)。 sesame-
显示芝麻点作为标记。实心芝麻点是
'﹅'(U+FE45)，空心芝麻点是'﹆'(U+FE46)。当未给出其他形状时，这是垂直书写模式下的默认形状。 <string>-
将给定字符串显示为标记。作者不应在
<string>中指定多个字符。用户代理可能会截断或忽略包含多个字素簇的字符串。 <color>-
定义标记的颜色。如果未指定颜色，则默认为
currentColor。
正式定义
| 初始值 | 作为简写中的每个属性
|
|---|---|
| 应用于 | 所有元素 |
| 继承性 | 是 |
| 计算值 | 作为简写中的每个属性
|
| 动画类型 | 作为简写中的每个属性 |
正式语法
text-emphasis =
<'text-emphasis-style'> ||
<'text-emphasis-color'>
<text-emphasis-style> =
none |
[ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] |
<string>
<text-emphasis-color> =
<color>
示例
带有强调形状和颜色的标题
此示例绘制了一个标题，其中使用三角形来强调每个字符。
CSS
h2 {
text-emphasis: triangle #dd5555;
}
HTML
<h2>This is important!</h2>
结果
规范
| 规范 |
|---|
| CSS 文本装饰模块级别 3 # text-emphasis-property |
浏览器兼容性
加载中…
另见
- 长格式属性
text-emphasis-style、text-emphasis-color。 text-emphasis-position属性允许定义着重号的位置。