CSS 可以單獨根據所選元素設定「元素的樣式」嗎？

樣式基於所選 的元素：CSS 單獨可用嗎？

問題： 嘗試對 進行樣式設定基於所選的元素事實證明，使用 CSS 是一個挑戰。與可以直接設定樣式的選項元素不同，對所選元素的樣式仍然難以捉摸。

答案：

僅靠 CSS 不足以對 進行樣式設定。基於所選的的元素。然而，涉及 onchange 事件和資料屬性分配的巧妙解決方法可以為您提供這種令人垂涎的能力。

解決方案：

1. 分配一個值到資料選擇的屬性：
   在上元素，加入一個onchange 事件，將目前值指派給data-chosen 屬性。這使得所選選項的值可用於 CSS。
2. 以選擇元素為目標：
   建立以 為目標的 CSS 規則。基於資料選擇屬性的元素。在此範例中，opt3 值旨在設定所選選項的樣式。

<select onchange=" this.dataset.chosen = this.value; ">
    ...
    ...
</select>

select[data-chosen='opt3'] { 
    border: 2px solid red;
}

注意： 雖然此解決方案提供了一種有效的方式來設定 的樣式;基於所選 的元素，它可能不會得到跨瀏覽器的廣泛支援。

以上是CSS 可以單獨根據所選元素設定「元素的樣式」嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！