CSS 勾勾是指在元素中添加勾勾樣式，用來表示當前選中或完成狀態的樣式，非常常見。下面是一些常用的勾勾樣式：

/* 實心勾勾 */
.checkmark {
width: 1em;
height: 1em;
border-radius: 50%;
background: #32CD32;
padding: 0.1em;
display: flex;
align-items: center;
justify-content: center;
}
.checkmark::before {
content: '';
width: 0.3em;
height: 0.6em;
border: solid #fff;
border-width: 0 0.2em 0.2em 0;
transform: rotate(45deg);
}
/* 空心勾勾 */
.checkmark {
width: 1.5em;
height: 1.5em;
border: 2px solid #32CD32;
border-radius: 50%;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.checkmark::before {
content: '';
position: absolute;
top: 50%;
left: 20%;
width: 25%;
height: 50%;
border: 2px solid #32CD32;
border-top: none;
border-right: none;
transform: rotate(-45deg) translate(-50%, -50%);
}
/* 空心圓圈 */
.checkbox {
width: 1.5em;
height: 1.5em;
border: 2px solid #4D4D4D;
border-radius: 50%;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.checkbox::before {
content: "";
position: absolute;
width: 0.5em;
height: 0.5em;
background-color: #4D4D4D;
border-radius: 50%;
}
.checkbox:hover::before {
background-color: #32CD32;
}

可以看到，勾勾樣式在樣式表中使用了偽元素before，通過對其進行旋轉、平移等變換來實現不同樣式。另外，我們還可以通過使用圖片等其他方式來實現勾勾樣式。