टेबल हेडर के लिए सीएसएस, यहां तक ​​कि विषम पंक्तियां भी?

Question

मेरी टेबल संरचना निम्नानुसार है:

<table> 
<thead> 
    <tr class="navigation"> 
    </tr> 
</thead> 
<thead> 
    <tr class="headers"> 
    </tr> 
</thead> 
<tbody> 
    <tr class="even"> 
    <td><a href="#"/></td> 
    </tr> 
    <tr class="odd"> 
    </tr> 
    </tr> 
</tbody> 
</table> 

मैंने निम्नलिखित सीएसएस को परिभाषित किया है, मेरे सीएसएस में "नेविगेशन", "हेडर", "यहां तक ​​कि", "विषम" वर्ग कैसे लागू कर सकते हैं? उन्हें परिभाषित करने के लिए 'table.even', 'table.odd' जैसे 'टेबल' वर्ग से संबंधित है? धन्यवाद

table{ 
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif; 
    font-size: 10px; 
    #margin: 45px; 
    width:100%; 
    text-align: left; 
    border-collapse: collapse; 
} 

Answer 1

केवल पेरेंट तत्व के वर्ग या पेरेंट तत्व ही संदर्भ हैं आप तत्व की एक से अधिक प्रकार के लिए वर्ग के नाम का उपयोग करने के है। उदाहरण के लिए, इस:

.navigation { font-weight:bold } 

... बजाय इस की:

tr.navigation { font-weight:bold } 

यह नीचे लोड समय पर ब्राउज़र द्वारा पृष्ठ renders कट जाएगा।

संदर्भ: Optimize browser rendering [गूगल कोड]

Answer 2

किसी भी तत्व को एक वर्ग को लागू करने आपको निम्न कार्य करने की अनुमति देता है:

tr.navigation { font-weight:bold } 

तो बनाने ज़ेबरा:

element.className { rules } 

अपने TR साथ

तो, आप निम्न कार्य कर सकता है - आपकी बाधाओं और घटना पंक्तियों पर पट्टियां इस तरह की की जा सकती हैं:

tr.odd { background-color:#FFF; } 
tr.even { background-color:#CCC; } 

Answer 3

आप उपयोग

table thead tr.navigation {} 
table thead tr.headers {} 
table tbody tr.even {} 
table tbody tr.odd {} 

Answer 4

अधिक सरल और वर्ग की आवश्यकता नहीं है:

tbody tr:nth-child(odd) { 
    put your style here... 
} 

tbody tr:nth-child(even) { 
    put your style here... 
} 

मुझे आशा है कि मदद!