div id = "content"의 후손 인 모든 선택 요소의 변화 너비

Question

나는 모두 스타일을 만들려고 노력하고 있습니다 <select> a의 후손 인 요소 <div>. 나는 그들에게 수업을 넣을 수 있었지만 영리하려고 노력하고 있었다 :-)

IE6에서는 작동하지 않지만 IE7 등에서 작동합니까?

어떻게해야합니까?

여기에 내 선택 중 하나가 있습니다 (클래스 나 ID는 없음)이지만 ID는 "Content"인 DIV의 후손입니다.

<div id="content">
    <select >
        <option></option>
    </select>
</div>

어떤 아이디어?

Answer 1

ID = "Content"가있는 요소의 자손 인 선택을 원한다면 :

#content select { ... }

ID = "Content"가있는 요소의 직접 후손 인 선택을 원한다면 :

#content > select { ... }

ID = "Content"가있는 div 요소 만 제한하려면 :

div#content select { ... }

두 번째는 일부 오래된 브라우저에서는 작동하지 않을 수도 있지만, 다른 브라우저는 Netscape 4와 같이 CSS 지원이 전혀없는 한 고대 브라우저에서도 작동해야합니다.

Answer 2

이것은 브라우저에서 작동해야합니다.

#content select {
   // Styles for selects inside the div with id `content'
}

Answer 3

.myDiv select {
  font-family:verdana;
}

<div class="myDiv">
  <p><select>...</select></p>
  <p><select>...</select></p>
</div>

Answer 4

div#content > select {
}

Answer 5

.content select {

              css here

}

나는 이것이 당신이 이것을 달성 할 수있는 방법이라고 믿습니다. 여기서 "콘텐츠"는 Div의 클래스입니다. 이것은 "컨텐츠"클래스가있는 div 내부의 모든 선택을 형식화합니다.

행운을 빌어 요!

Answer 6

Nick의 해결책은 직접 후손만을 얻으므로 Div의 양식에서 선택되지 않습니다. 이것은 다른 요소의 깊이에 상관없이 다음을 얻을 수 있습니다.

#content select { width: 100px }

예를 들어 텍스트 입력 만 얻으려면 다음을 수행 할 수 있습니다.

#content select[type=text] { width: 100px }

그리고 암호 입력이 텍스트 입력과 다르다는 것을 잊지 마십시오!