सीएसएस :: टेबल सेल पर इससे पहले कि

Question

मैं कुछ तालिका सेल एक position:absolute है क्या पर एक ::before चयनकर्ता जोड़ना चाहते हैं, लेकिन यह विफल रहता है:

table{ border:1px solid #ccc; padding:10px; } 
 
table td{ border:1px solid #ccc; padding:5px; } 
 

 
.useBefore::before{ 
 
    content:'before'; 
 
    position:absolute; 
 
}

<table> 
 
     <tbody> 
 
     <tr> 
 
      <td>bird</td> 
 
      <td>animal</td> 
 
      <td>nature</td> 
 
     </tr> 
 
     <tr class='useBefore'> 
 
      <td>building</td> 
 
      <td>robot</td> 
 
      <td>city</td> 
 
     </tr> 
 
     </tbody> 
 
    </table>

मैंने देखा है कि अगर मैं जोड़ने ::beforetr के सभी के लिए तो यह काम करता है:

table{ 
 
    border:1px solid #ccc; 
 
    padding:10px; 
 
    } 
 
    table td{ 
 
    border:1px solid #ccc; 
 
    padding:5px; 
 
    } 
 
    
 
    tr::before{ 
 
    content:'before'; 
 
    position:absolute; 
 
    }

<table> 
 
    <tbody> 
 
     <tr> 
 
     <td>bird</td> 
 
     <td>animal</td> 
 
     <td>nature</td> 
 
     </tr> 
 
     <tr class='useBefore'> 
 
     <td>building</td> 
 
     <td>robot</td> 
 
     <td>city</td> 
 
     </tr> 
 
    </tbody> 
 
    </table>

लेकिन यह वही नहीं है जो मैं चाहता हूं, क्योंकि मैं इसे केवल कुछ में जोड़ना चाहता हूं।

Answer 1

मुझे यकीन नहीं है कि यह वास्तव में क्यों विफल रहता है, लेकिन आप इसे पहले टेबल सेल पर जोड़ सकते हैं।

.useBefore td:first-child:before{ 
    content:'before'; 
    position:absolute; 
    }