用css控制表格第一列序号自动增加

七海恋空 2021-01-25 浏览(0 评论(0

.box table tbody {

   counter-reset:sectioncounter;

}

.box table tr:not(:first-child) td:first-child:before{

   content:counter(sectioncounter);

   counter-increment:sectioncounter;

}

表格的第一个tr要放表头th所以,用not(:first-child)来过滤表格第一行。

从表格的第二行的开始,第一列内容为自增的序号。

div class="box"

    table

        tbody

            tr

                th序号th

                th内容th

            tr

            tr

                tdtd

                td测试内容td

            tr

        tbody

    table

div