CSS : 2 <code><thead></code>에서 <code><tr></code> 이상이있는 경우 <tr>

Question

2가 가능 처음 <tr>의 첫 번째 <th>에서 규칙을 적용되어있는 경우 첫 에 규칙을 적용?

table tr:first-child th:first-child 

을 만 1 <tr>가있는 경우 TI는 어쨌든 적용

나는했다.

Answer 1

당신은 너무처럼 :not() 및 :only-child 선택기의 조합을 사용할 수 있습니다 : 그것은 외아들이 아닌 경우

tr:first-child:not(:only-child) th:first-child { 
    color:red; 
} 

코드가 비교적 자명, 그것은 첫 번째 아이에 영향을 미칠 것입니다.

DEMO

그것은 support하지만 상대적으로 나쁜 가지고, 당신은 당신이 아래 IE8 이상을 지원해야하는 경우이를 만회하기 위해 javascript polyfill이 필요할 수 있습니다.

Answer 2

CSS class을 사용하지 않으면 이것이 가능하지 않다고 생각합니다. 당신 tr의 동적으로 만드는 경우. 나는 다음과 같이 수행하는 것이 좋습니다 :

if(condition for rows > 2) { 
    <tr><th class="applyCSS"></th><th></th></tr> 
    <tr><th></th><th></th></tr> 
    ...... 
} 
else {  //only one tr 
    <tr><th></th><th></th></tr> 
} 

CSS : 번째 전용 아이 :에 첫 child` 당신은 몇 가지 기본 스타일이있는 경우

applyCSS { .... }