पहले वाले को छोड़कर सभी 'tr' चुनें

Question

मैं सीएसएस के साथ तालिका में trपहले को छोड़कर सभी तत्वों का चयन कैसे कर सकता हूं tr?

मैंने इस पद्धति का उपयोग करने की कोशिश की , लेकिन पाया कि यह काम नहीं किया।

Comments

इसके लिए संगत होने के लिए किन ब्राउज़र की आवश्यकता है?

— पेका

w3schools.com/CSS/css_pseudo_classes.asp

— बद्र हरि

@ पेकका सवाल महत्वपूर्ण है, क्योंकि मैं मानक सीएसएस का उपयोग करके ऐसा करने के लिए किसी भी तरह से नहीं सोच सकता हूं जो IE के विभिन्न संस्करणों के साथ काम करेगा। यदि आपको IE का समर्थन करने की आवश्यकता है, तो एकमात्र व्यावहारिक समाधान पहले के लिए एक वर्ग है <tr>और उनमें से बाकी के लिए एक अलग वर्ग है।

— स्पडली

मैं IE के बारे में चिंतित नहीं हूं, लेकिन यह FF और GC

Answer 1

किसी वर्ग को पहले trया बाद के trs से जोड़कर । अकेले सीएसएस के साथ इच्छित पंक्तियों का चयन करने का कोई क्रॉसबोवर तरीका नहीं है।

हालाँकि, यदि आप Internet Explorer 6, 7 या 8 की परवाह नहीं करते हैं:

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

Comments

मैं tr:not(:first-of-type)एक संभावित समाधान के रूप में भी इंगित करना चाहूंगा , यदि आप पहले सामान्य बच्चे के बजाय एक विशिष्ट चयनकर्ता के पहले उदाहरण की तलाश कर रहे हैं।

— जोशुआ बर्न्स

मुझे लगता है कि 2019 में हम IE (IE6 के उपयोगकर्ताओं के 0.5% से कम IE10 के साथ किया जाता है

— Webwoman

Answer 2

मुझे आश्चर्य है कि किसी ने भी साइबिंग कोम्बिनेटर के उपयोग का उल्लेख नहीं किया है, जो IE7 द्वारा समर्थित हैं और बाद में:

tr + tr /* CSS2, adjacent sibling */
tr ~ tr /* CSS3, general sibling */

वे दोनों बिल्कुल उसी तरह से कार्य करते हैं (वैसे भी HTML तालिकाओं के संदर्भ में):

tr:not(:first-child)

Comments

प्रतीक्षा करें ... यह स्वीकृत उत्तर कैसे होना चाहिए? आप उस कथन से "सभी लेकिन पहले" प्राप्त नहीं कर सकते, जो कि ओपी पूछ रहा है। tr + tr आपको एक ही तत्व मिलेगा। मुझे लगता है कि tr ~ tr आप सभी को मिलेगा (मुझे लगता है कि माता-पिता की तरह कुछ: पहला बच्चा ~ tr), लेकिन नहीं के रूप में आसानी से पठनीय के रूप में नहीं के रूप में नहीं:

— 21

@hairbo: tr + tr आपको कोई भी tr मिलेगा जो सीधे दूसरे tr का अनुसरण करता है। यदि आपके पास तीन पंक्तियों वाली एक तालिका है, तो तीसरी पंक्ति सीधे दूसरी पंक्ति का अनुसरण करती है, इसलिए यह मेल भी खाएगी। यदि आप इसके बजाय tr: first-child + tr का उपयोग करते हैं तो आपको केवल एक ही तत्व मिलेगा। + और ~ के बीच एकमात्र अंतर यह है कि ~ दो उल्लिखित दोनों के बीच किसी भी अन्य तत्वों की संख्या की अनुमति देता है।

— BoltClock

बस जोड़ना चाहते थे, elem + elemजब आप जिन तत्वों को लक्षित करना चाहते हैं, उनके लिए एक महान सामान्य समाधान एकमात्र बच्चे नहीं हैं। उदाहरण के लिए, यदि किसी <h2>को कई <p>टैग द्वारा अनुसरण किया जाता है , तो पहला <p>उस मामले में पहला बच्चा नहीं है।

— असंतुष्ट

Answer 3

आदर्श समाधान लेकिन IE में समर्थित नहीं है

tr:not(:first-child) {css}

दूसरा समाधान सभी tr की शैली बनाना होगा और पहले बच्चे के लिए css के साथ ओवरराइड करना होगा:

tr {css}
tr:first-child {override css above}

Answer 4

ऐसा लगता है कि 'पहली पंक्ति' जिस पर आप बात कर रहे हैं वह आपका टेबल-हेडर है - इसलिए आपको वास्तव में उपयोग करने के बारे में सोचना चाहिए theadऔर tbodyअपने मार्कअप ( यहां क्लिक करें ) के परिणामस्वरूप 'बेहतर' मार्कअप (शब्दार्थ रूप से सही, स्क्रीन्रेडर्स जैसी चीजों के लिए उपयोगी होगा) ) और आसान, सीएसएस-चयन के लिए क्रॉस-ब्राउज़र-फ्रेंडली संभावनाएं ( table thead ... { ... })

Answer 5

हालांकि प्रश्न का एक सभ्य जवाब पहले से ही है, मैं सिर्फ यह तनाव देना चाहता हूं कि :first-childटैग उस आइटम प्रकार पर जाता है जो बच्चों का प्रतिनिधित्व करता है।

उदाहरण के लिए, कोड में:

<div id"someDiv">
     <input id="someInput1" /> 
     <input id="someInput2" />
     <input id="someInput2" />
</div

यदि आप मार्जिन के साथ केवल दूसरे दो तत्वों को प्रभावित करना चाहते हैं, लेकिन पहले नहीं, तो आप ऐसा करेंगे:

#someDiv > input {
     margin-top: 20px;
}
#someDiv > input:first-child{
     margin-top: 0px;
}

वह यह है कि चूंकि inputबच्चे हैं, इसलिए आप first-childचयनकर्ता के इनपुट हिस्से पर जगह बनाएंगे।

Answer 6

क्षमा करें, मुझे पता है कि यह पुराना है, लेकिन सभी tr तत्वों को उस तरह से स्टाइल न करें जिस तरह से आप चाहते हैं कि सभी को छोड़कर पहला और पूर्ण वर्ग का उपयोग करें: पहला-बच्चा जहाँ आप सभी tr तत्वों के लिए निर्दिष्ट किए गए चीज़ों को रद्द करते हैं।

इस उदाहरण से बेहतर विवरण:

http://jsfiddle.net/DWTr7/1/

tr {
    border-top: 1px solid;
}
tr:first-child {
    border-top: none;   
}

/ पैट्रिक

Answer 7

चूंकि tr:not(:first-child)IE 6, 7 द्वारा समर्थित नहीं है। 8. आप jQuery की मदद का उपयोग कर सकते हैं। आप इसे यहाँ पा सकते हैं

Answer 8

एक अन्य विकल्प:

tr:nth-child(n + 2) {
    /* properties */
}

Answer 9

हो सकता है कोई व्यक्ति लाभान्वित हो, नीचे मैंने क्या उपयोग किया है

ol li:not(:first-child) {
    background: black;
    color: white;
}

Answer 10

आप इस तरह से अपने CSS में एक छद्म वर्ग चयनकर्ता का उपयोग कर सकते हैं:

.desc:not(:first-child) {
    display: none;
}

वह वर्ग को प्रथम तत्व के साथ वर्ग को लागू नहीं करेगा।

यहाँ एक उदाहरण के साथ एक JSField है: http://jsfiddle.net/YYTFT/ , और यह छद्म वर्ग चयनकर्ताओं को समझाने का एक अच्छा स्रोत है: http://css-tricks.com/pseudo-class-selectors/

Comments

यह शैली को पहले तत्व, बिंदु पर लागू नहीं करेगा। first-childवर्गों की उपेक्षा करता है।

— Fez Vrasta

Answer 11

आप एक वर्ग बना सकते हैं और वर्ग का उपयोग कर सकते हैं जब आप अपने भविष्य के सभी को परिभाषित करते हैं जो आप चाहते हैं (या नहीं चाहते) सीएसएस द्वारा चुना जाना चाहिए।

यह लिखकर किया जाएगा

<tr class="unselected">

और फिर आपके सीएसएस में लाइनें हैं (और उदाहरण के रूप में टेक्स्ट-एलायंस कमांड का उपयोग करके):

unselected {
  text-align:center;
}



selected {
  text-align:right;
}

Comments

दलीलें जवाब देने से पहले प्रश्न को समझें

— अम्मार बोजोर्गवार