CSS中的右上角打勾，是許多網(wǎng)站和應(yīng)用程序中經(jīng)常使用的一種UI設(shè)計元素。它可以用于表示完成了某項任務(wù)或操作，或者用于標記文本中的項目。這種打勾效果可以通過CSS的偽元素和背景圖像屬性來實現(xiàn)。
.checkmark {
position: relative;
display: inline-block;
width: 18px;
height: 18px;
border-radius: 50%;
border: 2px solid #0e8ce4;
}
.checkmark:after {
content: "";
position: absolute;
top: 2px;
left: 6px;
width: 5px;
height: 10px;
border: solid #fff;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}這段CSS代碼首先創(chuàng)建了一個圓形的
元素，并設(shè)置了它的寬度、高度和邊框樣式。之后，使用偽元素:after來添加打勾的形狀。這個:before偽元素創(chuàng)建一個空的內(nèi)容區(qū)域，并設(shè)置絕對定位、邊界和角度變換，以形成一個像打勾的形狀。使用:before偽元素而不是背景圖像屬性是為了能更精確地控制打勾的位置和樣式。