:checked 의사 클래스를 사용하여 `` 요소의 스타일을 지정할 수 있나요?

CSS :에 대한 의사 클래스 기능을 확인했습니다. 요소

<옵션> 내의 요소 요소는 옵션 목록에서 사용자가 현재 선택한 것을 나타냅니다. 사용자 인터페이스를 향상시키려면 현재 선택된 옵션의 스타일을 다른 옵션과 다르게 지정하는 것이 바람직할 수 있습니다. 그러나 일반적으로 스타일을 지정하는 데 사용되는 :checked 가상 클래스는 다음과 같습니다. 및 요소는 에 적용되지 않습니다. 요소.

해결책:

:checked 의사 클래스를 활용하여 요소를 생성합니다. HTML4 사양에서는 selected 속성을 사용하여 현재 선택된 옵션을 나타냅니다. 이 속성을 참조하면 동일한 스타일을 요소.

option[selected] {
  color: red;
}

참고: 선택한 옵션의 색상 스타일 지정은 모든 브라우저에서 지원되지 않을 수 있습니다.

예:

드롭다운에서 현재 선택한 옵션을 숨기려면 목록:

option:checked {
  display: none;
}

<select>
  <option>A</option>
  <option>B</option>
  <option>C</option>
</select>

위 내용은 :checked 의사 클래스를 사용하여 `` 요소의 스타일을 지정할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!