तरीके सीएसएस

Question

इस कोड IE के अलावा अन्य ब्राउज़रों पर काम कर रहा है के माध्यम से तालिका के पहले कॉलम को छिपाने के लिए:

table.tbl.tr.td:first-child { display: none; } 

मैं इसे सभी ब्राउज़रों पर काम करने के लिए के लिए क्या उपयोग होगा?

Answer 1

दुर्भाग्य से, IE के पुराने संस्करण समर्थित नहीं हैं: सीएसएस में पहला बच्चा। आईई 8 के बारे में पता नहीं है। वैसे भी, यदि आप जावास्क्रिप्ट नहीं करना चाहते हैं, और आपके पास एचटीएमएल तक पहुंच है, तो टेबल में पहले कॉलम टीडीएस में "फर्स्ट" क्लास असाइन करना बहुत आसान है।

table td.first { display: none; } 

Answer 2

अच्छा, संक्षिप्त उत्तर यह है कि आप इसे IE के पुराने संस्करणों में काम नहीं कर सकते हैं। मुझे लगता है कि आईई 8 इसे संभालेगा। अभिव्यक्ति नामक एक सीएसएस हैक है जो इस मुद्दे को हल करेगा लेकिन अभिव्यक्ति इतनी खराब विचार है कि मैं आपको यह दिखाने के लिए भी नहीं दिखाऊंगा।

अपने सीएसएस को जिस तरह से रखें, और एक जावास्क्रिप्ट जोड़ें जो आपके लिए आईओ पर है, तो DOMReady पर आपके लिए ऐसा ही करता है।

Answer 3

अफसोस की बात है, बहुत कम किया जा सकता है। <colgroup> आकर्षक लग रहा है, लेकिन ब्राउज़र इसे अलग तरह से इलाज करते हैं।
आपको प्रत्येक सेल के लिए मैन्युअल रूप से कक्षा जोड़नी पड़ सकती है, या JavaScript का उपयोग करना पड़ सकता है।

Answer 4

आपका अभिव्यक्ति ऊपर बिल्कुल काम नहीं होगा:

<table> 
    <tr> 
    <td class="first">...</td> 
    <td>..</td> 
    .. 
    </tr> 
</table> 

फिर आप की तरह एक सीएसएस प्रविष्टि बना सकते हैं: तो एचटीएमएल तरह दिखाई देगा। table.tbl.tr.td एक तालिका तत्व का चयन करेगा जिसे इस तरह परिभाषित किया गया है: <table class="tbl tr td"> लेकिन इसकी कोशिकाएं नहीं।

यह इस तरह होना चाहिए और :first-child selector इंटरनेट एक्सप्लोरर 6 से ऊपर सभी ब्राउज़रों काफी में समर्थित है:

table.tbl tr td:first-child { display: none; } 

Answer 5

IE के लिए आप/में सक्षम हो सकता है चाहिए तो अपने तालिका स्तंभ के लिए स्तंभ और colspans की स्थापना को छिपाने सीएसएस में हैं।

जहां तक ​​मुझे पता है कि यह केवल आईई में काम करेगा, जो (एक बार, इसके क्रेडिट के लिए) में कोल और कोस्पैन का सबसे अच्छा कार्यान्वयन होता है। अन्य ब्राउज़रों यहाँ कमजोर कर रहे हैं (लेकिन यह कल्पना की एक बहुत ही मामूली हिस्सा है)

Answer 6

छुपाएं पहले कॉलम

table td:nth-child(1){ display:none;} 

काम करता है क्रोम + फ़ायर्फ़ॉक्स में ठीक लेकिन IE में

उपयोग Jquery क्रॉस प्लेटफॉर्म को संभालने के लिए नहीं उपयोग करने में समस्याएं:

$('table td:nth-child(1)').hide(); 

सभी ब्राउज़रों में काम करता है!

Answer 7

, बस का उपयोग करें:

table td:nth-child(n){ 
    display:none; 
} 

जहाँ n स्तंभ छिपाए जाने वाले है।

table.marks.hideSubject  {td:nth-child(1) {display: none;}} 
table.marks.hideDescription {td:nth-child(2) {display: none;}} 
table.marks.hideMark   {td:nth-child(3) {display: none;}} 
table.marks.hideRank   {td:nth-child(4) {display: none;}} 

Answer 8

सीएसएस वें वाले बच्चे का उपयोग कर हम कॉलम छिपा कर सकते हैं द्वारा:

यहाँ एक के उपयोग का उदाहरण है। केवल तालिका आईडी और कॉलम इंडेक्स निर्दिष्ट करने की आवश्यकता है।
इस उदाहरण में मैं तालिका के अंतिम 3 कॉलम छुपा रहा हूं।

<style> 
    #ID_OF_THE_TABLE tr *:nth-child(10),tr *:nth-child(9),tr *:nth-child(8){ 
     display: none; 
    } 
</style> 

Answer 9

समाधान, वह मेरे लिए काम किया, था:

td { display: none; } 
td + td { display: table-cell; } 

जावास्क्रिप्ट, एक अतिरिक्त वर्ग की कोई जरूरत नहीं की जरूरत नहीं है।

चीयर्स