在CSS中,可以使用偽類來為單選按鈕(radio)設置樣式。通過偽類選擇器,我們可以為選中(:checked)和非選中(:not(:checked))兩種狀態設置不同的樣式。
input[type="radio"]:checked { background-color: #4CAF50; } input[type="radio"]:not(:checked) { background-color: #fff; }
上面的代碼中,我們為選中的單選按鈕設置了綠色背景色 (#4CAF50),為非選中的單選按鈕設置了白色背景色(#fff)。當然,你也可以按照你的喜好,修改這些顏色。
此外,我們還可以為單選按鈕設置其他樣式,比如邊框、圓角、陰影等等。例如:
input[type="radio"] { border: 1px solid #ccc; border-radius: 4px; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); }
上面的代碼中,我們為單選按鈕設置了1像素的灰色實線邊框,4像素的圓角,以及一個細小的黑色陰影效果。
總之,通過CSS,我們可以很容易地為單選按鈕設置各種樣式,以達到美化效果。