tutorial - what is css in english




सीएसएस का उपयोग केवल तालिका के दूसरे कॉलम को कैसे बदला जाए (4)

केवल सीएसएस का उपयोग करके, मैं तालिका के केवल दूसरे कॉलम के सीएसएस को ओवरराइड कैसे कर सकता हूं।

मैं उपयोग कर सभी कॉलम प्राप्त कर सकता हूं:

.countTable table table td

मैं इसे संशोधित करने के लिए इस पृष्ठ पर एचटीएमएल नहीं प्राप्त कर सकता क्योंकि यह मेरी साइट नहीं है।

धन्यवाद।


आप इस तरह का :nth-child छद्म वर्ग का उपयोग कर सकते हैं:

.countTable table table td:nth-child(2)

नोट हालांकि, यह पुराने ब्राउज़र (या IE) में काम नहीं करेगा, आपको उस स्थिति में कक्षों को कक्षा या जावास्क्रिप्ट का उपयोग करने की आवश्यकता होगी।


आप दूसरे कॉलम में प्रत्येक सेल के लिए कक्षा निर्दिष्ट कर सकते हैं।

<table>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
</table>

इसे इस्तेमाल करे:

.countTable table tr td:first-child + td

आप अन्य कॉलम स्टाइल करने के लिए भी दोहरा सकते हैं:

.countTable table tr td:first-child + td + td {...} /* third column */
.countTable table tr td:first-child + td + td + td {...} /* fourth column */
.countTable table tr td:first-child + td + td + td +td {...} /* fifth column */

तालिका के केवल दूसरे कॉलम को बदलने के लिए निम्न का उपयोग करें:

सामान्य मामला:

table td + td{  /* this will go to the 2nd column of a table directly */

background:red

}

आपका मुकदमा:

.countTable table table td + td{ 

background: red

}

नोट: यह सभी ब्राउज़रों (आधुनिक और पुराने लोगों) के लिए काम करता है इसलिए मैंने अपने पुराने प्रश्न पर अपना जवाब जोड़ा





css