Styling a
JavaScript solutions have offered workarounds, but can CSS truly satisfy this requirement?
Step 1: Update the
Use the onchange event to assign the selected value to a custom data attribute on the
<select onchange="this.dataset.chosen = this.value;">
Step 2: Target and Style
With the selected value stored in the data attribute, you can now target the
select[data-chosen='opt3'] {
border: 2px solid red;
}For a live example, check out this CodePen: https://codepen.io/Aprillion/pen/xxx
The above is the detailed content of Can CSS Style a `` Element Based on the Selected ``?. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
