在CSS中，將復選框變成圓點是一個常見的需求，這通常涉及到使用CSS的border-radius屬性來將復選框的四個角變?yōu)閳A形，以及可能的其他樣式調整，以下是一些示例代碼，展示了如何實現這一功能：

1、HTML結構：

<input type="checkbox" class="circle-checkbox">

2、CSS樣式：

.circle-checkbox {
    border: 2px solid #000; /* 定義邊框寬度和顏色 */
    border-radius: 50%; /* 將邊框變?yōu)閳A形 */
    width: 20px; /* 定義寬度 */
    height: 20px; /* 定義高度 */
    background-color: #fff; /* 設置背景顏色 */
    position: relative; /* 設置為相對定位 */
    top: -2px; /* 調整位置 */
    left: -2px; /* 調整位置 */
}

3、JavaScript（可選）：

如果你需要更復雜的交互，比如當復選框被選中時改變樣式，可以使用JavaScript來添加事件監(jiān)聽器。

document.querySelector('.circle-checkbox').addEventListener('change', function(e) {
    if (e.target.checked) {
        // 選中時的樣式
        e.target.style.backgroundColor = 'red'; // 將背景色改為紅色
    } else {
        // 未選中時的樣式
        e.target.style.backgroundColor = 'blue'; // 將背景色改為藍色
    }
});

通過結合HTML、CSS和JavaScript，你可以創(chuàng)建一個具有圓形復選框的交互界面，并根據需要定制樣式和行為。