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

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

下面是一個示例，說明如何使用 text-emphasis 點添加到文本中：

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

這將在文本頂部添加一個點，如下所示。

圖片

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

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

這是它的樣子。

圖片

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

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

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

這是它的樣子。

圖片

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

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

這是它的樣子。

圖片

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

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