Question

Chrome浏览器向我显示表格中的所有标签都是第一个并添加填充到每个内部td标记

SCSS代码

    table 
    {
      tr{
        &:first-child,
        &:nth-child(1),
        &:first-of-type
        {
          td{
            padding: 30px 0 0 0 ;
          }
        }
      }

请同时查看图片。

我的错误在哪里？

Answer 1

检查https://jsfiddle.net/gmbqLk5c/28/这是否是你想要的。

<div class="container">
          <table class="mt-2 table table-bordered">
            <tbody>
              <tr>
                <td>
                  Sweden
                </td>
                <td>
                  13:00
                </td>
                 <td>
                 South Korea
                </td>
              </tr>
              <tr>
              <td  colspan="3">
                 <table class="inner-table">
                <tbody>
                  <tr>
                    <td> Test 1</td>
                    <td> Test 2</td>
                  </tr>
                </tbody>
              </table>
              </td>

              </tr>
              <tr>
                <td>
                  Bolivia
                </td>
                <td>
                  16:00
                </td>
                 <td>
                 Guam
                </td>
              </tr>
                 <tr>
                <td>
                  is
                </td>
                <td>
                  23:00
                </td>
                 <td>
                 Hell
                </td>
              </tr>
            </tbody>

          </table>      
        </div>
        <style>
        .container{
           .inner-table {
              tr{
                &:first-child,
                &:nth-child(1),
                &:first-of-type
                {
                  td{
                    border: solid 1px red;
                  }
                }
              } 
           }
        }
    </style>

如何获得表的第一个元素，css混淆

1 个答案: