[CSS]オプションボタン要素がチェックされたcssのサンプル

2021年9月8日

構文
option:checked {処理コード}

使用例

<!--オプションボタンがチェックされた場合にCSSを適用-->
<style>
  select {
     margin: 18px;
  }
  /* 選択されたオプションCSS */
   option:checked {
      box-shadow: 0 0 0 5px lime;
      color:red;
      background-color: skyblue;
  }
</style>
<body>

<select name="cityselect" id="city">
  <option value="tokyo" >東京</option>
  <option value="oosaka">大阪</option>
  <option value="fukuoka">福岡</option>
</select>
</body>

 

CSS

Posted by arkgame