मेरे सीएसएस में, मेरे पास एक प्रविष्टि है:

.isenabled {
    font-weight:bold; 
    background-color:lightyellow
}

एचटीएमएल में, मेरे पास है:

<table>
    <tr>
        <td class="isenabled">This is enabled</td>
        <td>This isn't</td>
    </tr>
</table>

यह इरादा के अनुसार काम करता है। मैं जो करना चाहता हूं वह है:

<table>
    <tr class="isenabled">
        <td>This is enabled</td>
        <td>So is this</td>
    </tr>
    <tr>
        <td class="isenabled">This is enabled</td>
        <td>This isn't</td>
    </tr>
</table>

लेकिन यह काम नहीं करता है क्योंकि यह खड़ा है (दोनों कोशिकाओं में डिफ़ॉल्ट पृष्ठभूमि है)। इसके बजाय मुझे क्या करना चाहिए?

[संपादित करें] मैंने वांछित व्यवहार को और अधिक स्पष्ट कर दिया है।

css
0
Tevildo 15 सितंबर 2018, 19:21

1 उत्तर

.isenabled तत्व को "isenabled" वर्ग के साथ पकड़ रहा है।

इसलिए जब आप क्लास को 'td' में जोड़ते हैं तो यह काम करता है।

<table>
    <tr>
        <td class="isenabled">This is enabled</td>
        <td>This isn't</td>
    </tr>
</table>

यदि आप 'tr' तत्व में वर्ग जोड़ रहे हैं तो css गुण 'tr' पर लागू होंगे लेकिन आप इसे 'td' पर लागू करना चाहते हैं।

'>' चयनित तत्व के बाद तत्काल बच्चे के लिए प्रयोग किया जाता है

इसलिए यदि आप चयनित के रूप में "tr> td" लिखते हैं तो यह सभी 'td' का चयन करेगा जो html दस्तावेज़ में किसी भी 'tr' के तत्काल बच्चे हैं।

तो आप ऐसा कर सकते हैं

tr.isenabled > td {
  font-weight: bold;
  background-color: lightyellow
}

यह सभी 'td' का चयन करेगा जो कि "isenabled" वर्ग वाले किसी भी तत्व का तत्काल बच्चा है।

सीएसएस चयनकर्ताओं के बारे में अधिक जानकारी यहां दी गई है https://www.w3schools.com/cssref/css_selectors। एएसपी.

0
Aagam Jain 15 सितंबर 2018, 19:35