CSS만 사용하여 선택된 라디오 버튼 레이블의 스타일을 어떻게 지정할 수 있습니까?

체크된 라디오 버튼 라벨 스타일 지정

CSS에서는 추가 사용 없이도 체크된 라디오 버튼과 관련된 라벨에 스타일을 적용할 수 있습니다. div와 같은 요소.

인접한 형제 조합자

체크된 라디오 버튼 입력을 즉시 따르는 레이블을 타겟팅하려면 CSS 인접 형제 조합자( )를 사용하세요. 이 조합자는 특정 요소에 인접하고 그 뒤에 오는 레이블과 일치합니다.

구문:

input[type="radio"]:checked + label {
  /* Styles */
}

예:

다음 HTML을 고려하세요. 마크업:

<input>

인접 형제 조합자를 사용하여 다음과 같이 선택된 라디오 버튼의 레이블 스타일을 지정할 수 있습니다.

input[type="radio"]:checked + label {
  font-weight: bold;
}

결과:

라디오 버튼을 선택하면 해당 라벨이 굵게 표시되어 선택 상태를 나타냅니다. 이 기술을 다양한 CSS 속성과 함께 사용하여 체크된 라디오 버튼의 모양을 사용자 정의할 수 있습니다.

위 내용은 CSS만 사용하여 선택된 라디오 버튼 레이블의 스타일을 어떻게 지정할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!