2012-08-26 2 views
3

MVC3 애플리케이션을 개발 중이므로 checkboxes 라벨을 선택해야합니다.css 확인란 레이블 선택기

ASP MVC3에는 코드의 일부를 생성하는 도우미 메서드가 있습니다. 그래서 checkbox에 대한 코드는 다음과 같습니다

<input id="Jumping_successleicht" type="checkbox" value="true" name="Jumping_successleicht"> 
<input type="hidden" value="false" name="Jumping_successleicht"> 
<label for="Jumping_successleicht"> 
<span>leicht (4)</span> 
</label> 

지금 나는 내가 label 선택하기 위해 다음 코드를 사용할 수 있습니다 생각했습니다

input[type=checkbox] + label { 
    background: url("../../Images/Controls/Checkbox.png") no-repeat scroll left center transparent; 
    clear: none; 
    cursor: pointer; 
    margin: 0; 
    padding: 5px 0 4px 24px; 
} 

을하지만 그것은 작동하지 않습니다. labelinput이 서로 옆에 있어야합니다.

어떤 문제라도이 문제를 해결하는 방법이 있습니까?

답변

4

<label for="#"> 요소의 대상을 보편적으로 선택하는 데 사용할 수있는 CSS 선택기가 없습니다. + 선택자는 "인접한 형제"선택 자입니다.

몇 가지 해결 방법이 있습니다

  • <label> 요소 내에 직접 <input> 요소를 넣어 (당신이 그런 식을 for="" 속성이 필요하지 않습니다).
  • <input />이 을 사용하기 위해 고유 한 id="" 속성을 가질 필요가 있음을 알기 때문에 스타일 시트에서 해당 ID로 확인란을 선택하기 만하면됩니다.
  • 각 적절한 입력에 대해 클래스를 지정하십시오.
  • 각 입력 및 해당 레이블 주위에 래퍼를 만듭니다.
+0

다음 특정 사양에 맞는 참조 조합이 제안되었지만 포함할지 여부는 결정되지 않았습니다. http://www.w3.org/ TR/selectors4/# idref-combinators 우리는 기다려야 할 것 같아요. – BoltClock

3

어쩌면 시도해 볼 수 있을까요?

 input[type="checkbox"] + label{ 
      background-color:red; 
     }