사용자 정의 클래스의 하위 클래스에만 스타일을 적용 할 수 있습니까? 내 DOM 요소의 하위 항목에 대해서만 jQuery UI 스타일을 재정의하고 싶습니다. 나는 아이 선택기를 시도했습니다CSS 클래스 선택자의 자식
뭔가
.myStuff .ui-button {font-size: 0.7em !important;}
<div class="myStuff">
<input type="button"></input> !-- jQuery UI class .ui-button
</div>
<input type="button"></input> !-- .ui-button not effected by my .ui-button style
같은 (>)하지만 첫 번째 수준에서 정지 :(. 나는 실제로 공간이 두 배 수준의 구문은 올바른 일이라고 생각 ... .하지만이 중 하나가 작동하지 않습니다
를이 내가 jQuery를 UI에서 오버라이드 (override)하기 위해 노력하고있어 정확한 선택기는 다음과 같습니다
가.ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1.1em/*{fsDefault}*/; }
.ui-widget .ui-widget { font-size: 1em; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; }
.ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ url(images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; }
.ui-widget-content a { color: #222222/*{fcContent}*/; }
.ui-widget-header { border: 1px solid #aaaaaa/*{borderColorHeader}*/; background: #cccccc/*{bgColorHeader}*/ url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/; color: #222222/*{fcHeader}*/; font-weight: bold; }
.ui-widget-header a { color: #222222/*{fcHeader}*/; }
내가 정말 그냥 글꼴 크기를 변경하려면
... 내가 노력 할게요 ca까지 당신의 예에 따라 그것을 계산해라. 그러나 나는 어떤 운도 어제 가지지 않고 있었다 :(.
"공백이있는 이중 클래스 구문"은 무엇입니까? – BoltClock
나는 .myStuff .ui 버튼에 대해 이야기하고 있습니다. 두 CSS 클래스 사이에 공백이 있습니다. 나는 그것이 일급의 후손을 암시한다고 생각했다. – farina