CSS 偽元素是一種非常便利的 CSS 技術(shù)。它可以幫助我們?cè)?HTML 元素的前面或者后面添加一些視覺上的效果，而且不需要在 HTML 中添加額外的元素或者內(nèi)容。

我們可以使用 ::before 或者 ::after 偽元素來實(shí)現(xiàn)這個(gè)功能。這兩個(gè)偽元素都可以在 HTML 元素的前面或者后面添加內(nèi)容，在實(shí)際使用中它們的效果是相同的。

下面的示例展示了如何使用 ::before 偽元素來添加一個(gè)綠色的箭頭：

.my-class::before {
content: "";
display: inline-block;
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 10px solid green;
margin-right: 10px;
}

在上面的代碼中，我們使用了 content 屬性來指定 ::before 偽元素的內(nèi)容為空字符串。然后，我們使用 display 屬性將它設(shè)置為行內(nèi)塊元素，可以讓它出現(xiàn)在父元素的同一行內(nèi)。接著，我們使用 border 屬性來創(chuàng)建一個(gè)綠色的箭頭，并設(shè)置它與父元素的間距。

除了 ::before 和 ::after 偽元素，CSS 還提供了一些其它的偽元素，比如 ::first-letter 和 ::first-line，它們分別可以用來控制第一個(gè)字符和第一行的樣式。使用偽元素可以讓我們更加靈活地控制 HTML 元素的樣式，而且也讓我們的 HTML 代碼更加清晰。