自訂單選按鈕的外觀超出了其基本功能。要修改它們的樣式，包括形狀和指示點，CSS 提供了多種可能性。
一種解決方案是使用 :after 偽類在單選按鈕輸入的頂部覆蓋自訂樣式。透過仔細定義大小、位置、形狀和顏色，開發人員可以創建個人化的單選按鈕。
例如，以下CSS 程式碼修改單選按鈕的外觀：
input[type='radio']:after {
width: 15px;
height: 15px;
border-radius: 15px;
top: -2px;
left: -1px;
position: relative;
background-color: #d1d3d1;
content: '';
display: inline-block;
visibility: visible;
border: 2px solid white;
}
input[type='radio']:checked:after {
width: 15px;
height: 15px;
border-radius: 15px;
top: -2px;
left: -1px;
position: relative;
background-color: #ffa500;
content: '';
display: inline-block;
visibility: visible;
border: 2px solid white;
}使用透過此程式碼，您可以輕鬆地將不同的顏色和形狀套用至單選按鈕形狀和指示點，從而使您的表單控制項具有更精緻和客製化的外觀。
以上是如何使用 CSS 設定單選按鈕的樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
