확인란이 선택되어 있으면 레이블 강조 표시

해당 확인란을 선택하면 레이블 색상을 변경하는 비 자바 스크립트 방법이 있습니까?

당신이 가지고 있다면

<div>
  <input type="checkbox" class="check-with-label" id="idinput" />
  <label class="label-for-check" for="idinput">My Label</label>
</div>

넌 할 수있어

.check-with-label:checked + .label-for-check {
  font-weight: bold;
}

이 작동을 참조하십시오 . 최신 버전이 아닌 브라우저에서는 작동하지 않습니다.

저는 Andrew의 제안을 좋아하고 실제로 CSS 규칙은 다음과 같으면됩니다.

:checked + label {
   font-weight: bold;
}

label및 input요소 의 암시 적 연결에 의존하는 것을 좋아하므로 다음과 같이합니다.

<label>
   <input type="checkbox"/>
   <span>Bah</span>
</label>

CSS 사용 :

:checked + span {
    font-weight: bold;
}

예 : http://jsfiddle.net/wrumsby/vyP7c/

이것은 :checked폼을보다 쉽게 ​​접근 할 수 있도록 의사 클래스를 사용하는 예입니다 . :checked의사 클래스는 이미지 갤러리와 같은 대화 형 위젯을 구축하기 위해 숨겨진 입력과 자신의 눈에 보이는 레이블을 사용할 수 있습니다. 테스트하려는 사람들을 위해 스니핑을 만들었습니다.

input[type=checkbox] + label {
  color: #ccc;
  font-style: italic;
} 
input[type=checkbox]:checked + label {
  color: #f00;
  font-style: normal;
} 

<input type="checkbox" id="cb_name" name="cb_name"> 
<label for="cb_name">CSS is Awesome</label> 

CSS만으로는 이것을 할 수 없습니다. jQuery를 사용하여 할 수 있습니다.

HTML

<label id="lab">Checkbox</label>
<input id="check" type="checkbox" />

CSS

.highlight{
    background:yellow;
}

jQuery

$('#check').click(function(){
    $('#lab').toggleClass('highlight')
})

이것은 모든 브라우저에서 작동합니다

http://jsfiddle.net/LgADZ/ 에서 작업 예제를 확인하십시오.