Tabela wewnątrz tabeli z różnymi stylami?

Question

Jak utworzyć dwa różne style dla dwóch tabel komórek tabeli, że jedna z nich znajduje się wewnątrz innej tabeli?

Mam dwa style CSS:

table.style1 { /* any styles */} 
table.style1 td { /* any styles */} 

i

table.style2 { /* any styles */} 
table.style2 td { /* any styles */ } 

W kodzie mam somting tak:

<table class="style1"> 
    <tr> 
     <td> 
     <table class="style2"> 
      <tr><td>bla bla<td></tr> 
     </table> 
     </td> 
    <tr> 
</table> 

i wyników jest - wszystko <td> komórek tabeli w drugiej tabeli (ze stylem2) są w stylu 1 ...!

Jak zrobić dwa różne stile css, kiedy mam stolik wewnątrz stołu?

Answer 1

Możesz śledzić poniżej kod

Na Tablicy 1

stołowego .style1 {/ * wszelkie style * /}

stół .style1 td {/ * wszelkie style * /}

dla tabeli 2

stół .style1 .style2 {/ * wszelkie style * /}

stół .style1 .style2 td {/ * wszelkie style * /}

Answer 2

Spróbuj tego kodu. Jestem pewien, że działa dobrze.

table.style1 { /* any styles */} 

table.style1 td { /* any styles */} 

i

table.style1 table.style2 { /* any styles */} 

table.style1 table.style2 td { /* any styles */} 

Answer 3

Oto jeden ze sposobów, aby wybrać poszczególne komórki tabeli http://jsfiddle.net/HR8Bg/2/

.style1 td { 
    background: blue; 
    color: #fff; 
} 

.style1 td td { 
    background: red; 
}