求助求助css计数器问题

@Ta 2023-03-24 9194点击
屏幕截图 2023-03-24 135647.png(89.49 KB)
这个ol标签自带的序号前后有很大空格
我把ol标签的padding改为0
ol.mytable {
    list-style: none;
    padding: 0px;

用.mytable li::before{
  content: counter(chapter)'. ';
}
在li标签前创建了一个计数器

有个问题是我点击下一页后 计数器还是从1开始
回复列表(7|隐藏机器人聊天)
  • @Ta / 2023-03-24 / /
    被锁定
    层主 @张小强 于 2023-03-24 19:15 删除了该楼层。
  • @Ta / 2023-03-24 / /

    @张小强,在 HTML 中,<ul> 标签用于创建无序列表,其中的每个列表项使用 <li> 标签定义。如果要设置列表项从指定数开始编号,可以使用 start 属性来指定开始编号的值。

    下面是一个示例,演示了如何在 <ul> 标签中设置从指定数开始编号:

    HTML代码

    在上述示例中,我们使用 start="3" 属性来指定从数字 3 开始编号。因此,列表项的编号从 3 开始,分别为 3、4、5、6。

    需要注意的是,start 属性只对无序列表(<ul>)有效,对于有序列表(<ol>)则应该使用 start 属性来指定开始编号的值。如果同时设置了 starttype 属性,则 start 属性必须放在 type 属性之前。

    HTML代码

    在上述示例中,我们使用 start="3"type="A" 属性来指定从字母 A 开始编号,且编号从 3 开始。因此,列表项的编号为 A、B、C、D。

  • @Ta / 2023-03-24 / /
    被锁定
    层主 @张小强 于 2023-03-24 19:14 删除了该楼层。
  • @Ta / 2023-03-24 / /

    @张小强,在 HTML 中,有序列表使用 <ol> 标签定义,其中的每个列表项使用 <li> 标签定义。如果要设置有序列表的起始编号,可以使用 start 属性来指定开始编号的值。

    下面是一个示例,演示了如何在 <ol> 标签中设置起始编号:

    <ol start="3">
      <li>Item 3</li>
      <li>Item 4</li>
      <li>Item 5</li>
      <li>Item 6</li>
    </ol>
    

    在上述示例中,我们使用 start="3" 属性来指定从数字 3 开始编号。因此,列表项的编号从 3 开始,分别为 3、4、5、6。

    需要注意的是,如果没有指定 start 属性,则默认从数字 1 开始编号。如果同时设置了 starttype 属性,则 start 属性必须放在 type 属性之前。

    <ol start="3" type="A">
      <li>Item A</li>
      <li>Item B</li>
      <li>Item C</li>
      <li>Item D</li>
    </ol>
    

    在上述示例中,我们使用 start="3"type="A" 属性来指定从字母 A 开始编号,且编号从 3 开始。因此,列表项的编号为 A、B、C、D。

  • @Ta / 2023-03-24 / /
    @ChatGPT,html list有序列表,如何保持第二页的不是从开始的?
  • @Ta / 2023-03-24 / /

    @张小强,在 HTML 中,有序列表使用 <ol> 标签定义,其中的每个列表项使用 <li> 标签定义。如果要在多页显示的有序列表中保持连续的编号,可以使用 start 属性指定每个页面开始的编号。

    例如,假设我们有一个有 10 个项目的有序列表,我们希望每页显示 5 个项目,我们可以将列表分成两个部分,每个部分包含 5 个项目。在第一个部分中,我们可以正常使用 <ol> 标签来定义列表,而在第二个部分中,我们可以使用 start 属性来指定从第 6 个项目开始编号。

    下面是一个示例,演示了如何在多页显示的有序列表中保持连续的编号:

    <!-- 第一页 -->
    <ol>
      <li>Item 1</li>
      <li>Item 2</li>
      <li>Item 3</li>
      <li>Item 4</li>
      <li>Item 5</li>
    </ol>
    
    <!-- 第二页 -->
    <ol start="6">
      <li>Item 6</li>
      <li>Item 7</li>
      <li>Item 8</li>
      <li>Item 9</li>
      <li>Item 10</li>
    </ol>
    

    在上述示例中,我们将第一个部分的前 5 个项目使用 <ol> 标签定义,并在第二个部分中使用 start="6" 属性指定从第 6 个项目开始编号。这样,在第二页中,列表项的编号将从 6 开始,依次为 6、7、8、9、10。

    需要注意的是,使用 start 属性指定起始编号时,只会影响当前列表的编号,不会影响后续列表的编号。因此,如果有多个分页的列表需要保持连续的编号,需要在每个列表中使用 start 属性来指定起始编号。

  • @Ta / 2023-03-24 / /
    @兲蛋,可以通过浏览器缓存sessionStorage记录当前页面的最好一个值,然后下一页的时候通过start 属性指定起始
添加新回复
回复需要登录