CSS text-emphasis-color 语法
在 CSS 中，text-emphasis-color 是 text-emphasis 的子属性，用于定义文本 “强调标记的颜色”。
语法：
text-emphasis-color: 颜色值;说明：
text-emphasis-color 属性的取值是一个颜色值，包括以下几种情况（常用的是前 4 种）。
- 关键字，比如 red、orange、skyblue 等。
- 十六进制值，比如 #F1F1F1。
- RGB 值，比如 rgb(255, 255, 255)。
- RGBA 值，比如 rgba(255, 255, 255, 1.0)。
- HSL 值，比如 hsl(60deg 75% 45%)。
- HSLA 值，比如 hsla(60deg 75% 45% / 60%)。
- HWB 值，比如 hwb(120deg 0% 50% / 75%)。
注意，text-emphasis-color 属性只有当 text-emphasis-style 属性的值不是 none 时才会生效。
text-emphasis “家族”
text-emphasis “家族” 其实有 4 个属性，分别如下。
- text-emphasis
- text-emphasis-color
- text-emphasis-style
- text-emphasis-position
需要注意的是，text-emphasis 只是 text-emphasis-color 和 text-emphasis-style 这 2 个属性的简写，并不包括 text-emphasis-position。
CSS text-emphasis-color 摘要
| 属于 | CSS 文本属性 |
|---|---|
| 使用频率 | 低 |
| 是否继承 | 是 |
| 默认值 | currentcolor |
| 兼容性 | 查看 |
| 官方文档 | 查看 |
| MDN | 查看 |
CSS text-emphasis-color 示例
接下来，我们通过一个简单的例子来讲解一下 CSS text-emphasis-color 属性是如何使用的。
示例：text-emphasis-color 基本用法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
em {
text-emphasis-style: circle;
text-emphasis-color: red;
}
</style>
</head>
<body>
<p>欢迎来到<em>绿叶网</em></p>
</body>
</html>页面效果如下图所示。
分析：
text-emphasis-color 属性无法单独使用，而需要搭配 text-emphasis-style 属性一起使用。其中，text-emphasis-style 属性用于定义强调的外观，而 text-emphasis-color 用于定义强调的颜色。
