Auto-number table rows?

后端 未结 4 909
无人共我
无人共我 2020-11-29 00:46

I have the following HTML table:

blue
red
4条回答
  •  天涯浪人
    2020-11-29 01:21

    Here is a modification of David Thomas' CSS solution that works with or without a header row in the table. It increments the counter on the first td cell of each row (thereby skipping the row with only th cells):

    table
    {
        counter-reset: rowNumber;
    }
    
    table tr > td:first-child
    {
        counter-increment: rowNumber;
    }
    
    table tr td:first-child::before
    {
        content: counter(rowNumber);
        min-width: 1em;
        margin-right: 0.5em;
    }
    

    You can see the behavior in this jsfiddle.

提交回复
热议问题