전체 클래스에 대해 확인란의 색상을 변경하지 않고 어떻게 변경합니까?

체크 박스 라벨의 스타일을 변경해야합니다. 내가 빨간색 할 텍스트를 필요로하지만 난 .ui-btn을 텍스트 클래스 스타일을 변경하면 페이지의 모든 버튼이 빨간색 텍스트 스타일을 얻을 것이다전체 클래스에 대해 확인란의 색상을 변경하지 않고 어떻게 변경합니까?

<div class="ui-checkbox"> 
    <input id="keepMeInformed" type="checkbox" data-theme="d" onchange="fixCheckboxesValues();" checked="checked" value="1" name="optedIn"> 
    <label class="optional ui-btn ui-btn-icon-left ui-btn-corner-all ui-btn-up-d ui-checkbox-off" for="keepMeInformed" data-theme="d"> 
     <span class="ui-btn-inner ui-btn-corner-all" aria-hidden="true"> 
     <span class="ui-btn-text">Label text</span> 
     <span class="ui-icon ui-icon-shadow ui-icon-checkbox-off"></span> 
     </span> 
    </label> 
</div>

이 내 HTML입니다.

.ui-btn-text{ 
    color:red; 
}

확인란의 레이블 색상 만 변경하는 방법이 있습니까?

편집는 :

들 덕분에 나는 체크 박스를 포장 사업부를 추가하는 문제를 해결하고 jQuery를 썼다 :

function changeCheckBoxStyle() { 
    $('#checkBoxWrapper').find('[class=ui-btn-text]').css('color','red'); 
}

을하지만 스콧의 솔루션은 :) 너무 좋아 감사

를 작동 생각

출처

2011-12-21 Marco Matarazzi

나머지 코드는 보지 않고 말하기가 어렵습니다. '.ui-checkbox .ui-btn .ui-bttn-inner .ui-btn-text {color : red;}와 같이 셀렉터에서 좀 더 구체적으로하려고 노력 했습니까? }'? – ptriek

아니면 그냥'.ui-btn-text-red'라는 새로운 클래스를 만들 수 있습니다.'.ui-btn-text'와'color : red'와 같은 속성을 기본적으로 가지고 있습니다. 또는 단지 하나의 버튼이라면 HTML에 'id'를 지정하고 해당 CSS를 사용하는 것이 어떻습니까? –

ID를 올바르게 사용한다고 가정하면 (페이지에 고유함) 다음이 작동합니다.

#keepMeInformed + label .ui-btn-text { 
    color: red; 
}

input 요소 keepMeInformed을 찾은 다음 형제 label 요소를 찾아 해당 레이블의 .ui-btn-text 클래스 요소에만 적용합니다.

출처

2011-12-21 15:23:56 ScottS

들 덕분에 나는 체크 박스를 포장 사업부를 추가하는 문제를 해결하고 jQuery를 썼다 : [ ' 이 <스크립트 유형 = "텍스트/자바 스크립트"> 기능 changeCheckBoxStyle() {\t $ ('#의 checkBoxWrapper ')가 찾기 (. class = ui-btn-text] ') .css ('color ','red '); 그러나 나는 scott의 해결책이 너무 좋아 보인다 고 생각합니다. :) thanks –

전체 클래스에 대해 확인란의 색상을 변경하지 않고 어떻게 변경합니까?

답변

관련 문제