在CSS中設(shè)置文本樣式的方法有很多。您可以更改顏色、大小、字體，甚至添加陰影和輪廓等效果。但最近，我了解到一個(gè)我以前沒有聽說過的時(shí)尚 CSS 屬性，它非常棒！

它被稱為文本強(qiáng)調(diào)（text-emphasis），是 text-emphasis-* 屬性組合的簡稱，可以為文本添加強(qiáng)調(diào)標(biāo)記。這些標(biāo)記可用于以各種方式突出顯示文本，例如在文本上方或下方添加點(diǎn)、圓、雙圓或文本。

下面是一個(gè)示例，說明如何使用 text-emphasis 點(diǎn)添加到文本中：

.text-emphasis-dot {
    text-emphasis: dot;
}

這將在文本頂部添加一個(gè)點(diǎn)，如下所示。

圖片

還可以使用如下 text-emphasis 屬性向文本添加雙圓：

.text-emphasis-double-circle {
    text-emphasis: double-circle;
}

這是它的樣子。

圖片

您也可以使用字母來強(qiáng)調(diào)文本。例如，您可以使用 $ 在文本下方添加美元符號，如下所示：

.text-emphasis-dollar {
    text-emphasis: '$' lime;
    text-emphasis-position: under;
}

該 text-emphasis-position 屬性用于指定強(qiáng)調(diào)標(biāo)記的位置?？梢允褂?nbsp;over 、 under 、 right 或 left 來定位強(qiáng)調(diào)標(biāo)記。

這是它的樣子。

圖片

哎呀！您甚至可以使用表情符號來強(qiáng)調(diào)文本。例如，您可以使用 ?? 在文本中添加火表情符號，如下所示：

.text-emphasis-fire {
    text-emphasis: '??';
}

這是它的樣子。

圖片

我認(rèn)為該 text-emphasis 屬性是一種有趣的方式，可以增加對文本的強(qiáng)調(diào)，并可用于為您的設(shè)計(jì)增添趣味。大多數(shù)現(xiàn)代瀏覽器都支持它，因此您可以立即開始使用它來使您的文本脫穎而出！

原文：https://www.amitmerchant.com/spicing-up-text-with-text-emphasis-in-css