在網(wǎng)頁(yè)開(kāi)發(fā)中，經(jīng)常需要使用勾選圖標(biāo)來(lái)表示選中或已完成的狀態(tài)。CSS提供了多種方法來(lái)實(shí)現(xiàn)勾選圖標(biāo)的顯示，下面介紹幾種常用的實(shí)現(xiàn)方法。
1. 利用偽元素:before或:after
可以在某個(gè)元素的:before或:after偽元素中添加一個(gè)content屬性，并設(shè)置為一個(gè)Unicode碼對(duì)應(yīng)的勾選圖標(biāo)字符，實(shí)現(xiàn)簡(jiǎn)單而且方便。例如：

p::before {
content: "\2714";
}

2. 利用checkbox的:checked偽類(lèi)
在input[type="checkbox"]元素的:checked偽類(lèi)中設(shè)置勾選圖標(biāo)的樣式，可以實(shí)現(xiàn)選中狀態(tài)下的勾選圖標(biāo)顯示。例如：

input[type="checkbox"]:checked::before {
content: "\2714";
}

3. 利用svg圖標(biāo)
使用svg圖標(biāo)是一種可擴(kuò)展的實(shí)現(xiàn)方式。可以將svg圖標(biāo)直接嵌入到HTML或使用CSS來(lái)引用。例如：

p::before {
content: url('check.svg');
}

綜上所述，以上三種方法都可以實(shí)現(xiàn)勾選圖標(biāo)的顯示，具體要根據(jù)具體情況選擇實(shí)現(xiàn)方式。