css id 와일드 카드 셀렉터

Question

정확하게 설명하는 방법을 모르지만 다음과 같은 상황이 있습니다. 나는 row1, row2 등과 같이 ID가 "row"로 시작하는 많은 div를 가지고 있습니다. 이들 모두에는 "element"라는 클래스가있는 다른 div가 있습니다.

[id*="row"] .element {width:0;} 

내 HTML은 다음과 같이이다 : 그것은 작동하지 않았다

<div id="row1"> 
<div class="element"></div> 
</div> 
<div id="row2"> 
<div class="element"></div> 
</div> 
<div id="row3"> 
<div class="element"></div> 
</div> 

and so on... 

내가 뭘 원하는 그래서 나는 이런 식으로 뭔가를 쓴 모든 "요소"div에 대한 규칙을 만드는 것입니다. 뭐가 잘못 됐는지 말해 줄래? 그건 그렇고, 다른 ID를 가진 다른 div도 "element"를 내부에 가지고 있고 다른 스타일을 가지고 있기 때문에 "element"에 대한 규칙을 추가하기 만하면됩니다.

Answer 1

그럼 실제로 코드가 잘 작동합니다. 이것

봐 :

<div id="row3"> 
<div class="element">three</div> 
</div> 
<div id="notARow"> 
<div class="element">three</div> 
</div> 

..

[id*="row"] .element {color: red} 

와는 행과 아이디의이 빨간색 것을 알 수 있습니다. 속성 selecors에 대한 자세한 정보를 들어

FIDDLE

-이 당신을 위해 작동하지 않았는지 생각한다면 the spec

---

을 확인, 내가 문제가 특이도 관련이 있다고 말할 것입니다.

.element 클래스 중 하나에서 'inspect element'를 마우스 오른쪽 버튼으로 클릭하고 특성 선택기 규칙이보다 구체적인 규칙에 의해 초과/무시되는지 확인하십시오.

Answer 2

.element을 사용하여 선택할 수 있습니다. 또한 해당 row div의 클래스를 사용해야하며 ID로 선택하지 않아도됩니다.

과 같이 : 당신은에 그 클래스와 충돌하는 요소가있는 경우 .element 이외에 무언가를 포함 할 필요가 유일한 것

.row .element { 
} 

: 등등

<div id="1" class="row"> 
    <div class="element"></div? 
</div> 

과 같이 선택합니다 당신이 선택하고 싶지 않은 페이지. 그 유일한 사람이 있다면

, 대신를 사용

.elements { 
}