如何使用 CSS 設定選定單選按鈕標籤的樣式？

在CSS 中設定所選單選按鈕標籤的樣式

要為所選單選按鈕的標籤設定樣式，請設定標籤元素的樣式並使用選擇器來定位相鄰的輸入[type ="radio"] 選取後。

HTML標記

<div class="radio-toolbar">
  <label><input type="radio" value="all" checked>All</label>
  <label><input type="radio" value="false">Open</label>
  <label><input type="radio" value="true">Archived</label>
</div>

CSS

.radio-toolbar input[type="radio"] {
  display: none;
}

.radio-toolbar label {
  display: inline-block;
  background-color: #ddd;
  padding: 4px 11px;
  font-family: Arial;
  font-size: 16px;
  cursor: pointer;
}

.radio-toolbar input[type="radio"]:checked + label {
  background-color: #bbb;
}

以上是如何使用 CSS 設定選定單選按鈕標籤的樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！