在 HTML 中，我們可以使用

標簽來展示一些預定義格式的文本，如代碼。而我們常常需要在頁面中用到勾選框，它可以是實心圓或空心圓，本文將介紹如何使用 HTML 和 CSS 在空心圓中打勾。
首先，我們需要創建一個空心圓，這可以使用 HTML 的<input>標簽加上type="checkbox"屬性實現。
<input type="checkbox" id="checkbox" name="checkbox" />
接下來，我們使用 CSS 中的::before偽元素來為空心圓添加打勾。
#checkbox::before{
content: "";
display: inline-block;
width: 10px;
height: 15px;
border: solid #666;
border-width: 0 3px 3px 0;
transform: rotate(45deg);
margin-right: 5px;
}
解析上述代碼：使用content: "";創建一個空的偽元素，通過display: inline-block;將其變成一個塊級元素，并定義寬高為 10px 和 15px。然后，我們使用border: solid #666;設置邊框樣式，border-width: 0 3px 3px 0;表示只有右邊和下邊有邊框，并且右邊和下邊的寬度為 3px。接著我們使用transform: rotate(45deg);繞著中心點旋轉 45 度，使其形成一個斜線。最后通過margin-right: 5px;和勾選框保持一定距離。
以上就是在空心圓內添加打勾圖案的代碼，不同的代碼可能會有所不同，但是核心思想一樣。通過 CSS 中的偽元素，我們可以為標簽添加一些非常有意思的樣式。