如何选择仅偶数tr的所有td来填充该td

时间:2019-05-01 09:28:10

标签: html css

我只想给HTML的所有TD添加填充,这是我的HTML代码

    <table class="overview">
     <tr>
      <td>brokerage</td>
      <td>price</td>
     </tr>
     <tr>
      <td>1</td>
      <td>26.5L</td>
     </tr>
     <tr>
      <td>rate</td>
      <td>build up area</td>
     </tr>
     <tr>
       <td>4818.00 per sq.ft.</td>
       <td>550 sq.ft.</td>
      </tr>
      <tr>
       <td>carpet area</td>
      <td>floor</td>
     </tr>
     <tr>
      <td>550 sq.ft.</td>
      <td>Lower of 4 floor</td>
    </tr>
    <tr>
     <td>posession status</td>
     <td>beadroom</td>
   </tr>
   <tr>
    <td>ready to move in</td>
    <td>2</td>
   </tr>
 </table>    

当我选择偶数TR并尝试对其进行填充时,什么也没发生

.overview tr:nth-child(even)
{
          padding:20px;
}

当我尝试此操作时,它会选择所有tr的偶数d

.overview tr td:nth-child(even){
      padding:20px ;
    }

1 个答案:

答案 0 :(得分:2)

您已将css应用于上述tr,需要将其应用于td。请尝试以下

.overview tr:nth-child(even) td {
    padding:20px;
}