首页 > 其他分享 >css计数器使用

css计数器使用

时间:2024-09-21 21:12:45浏览次数:10  
标签:counter 名字 计数器 使用 liCount css counters

counter-reset属性用于重置计数器,用法:计数器名字 初始值 计数器名字 初始值 ...可重复写多组
counter-increment属性用于设置计数器步增,用法:计数器名字 步增数(默认1) ...可重复写多组
counter方法,counter(计数器名字, 样式属性名)
counters方法,counters(计数器名字,'任意拼接字符串', 样式属性名)
mdn文档

css
ol {
  list-style: lower-roman;
  counter-reset: liCount;
}
li::before {
  content: counters(liCount, '-');
  counter-increment: liCount;
}
html
<ol>
    <li></li>
    <li></li>
    <li>
        <ol>
            <li>
                <ol>
                    <li></li>
                    <li></li>
                    <li></li>
                </ol>
            </li>
            <li></li>
            <li></li>
            <li></li>
        </ol>
    </li>
    <li></li>
</ol>

标签:counter,名字,计数器,使用,liCount,css,counters
From: https://www.cnblogs.com/wxynf4/p/18424514

相关文章

  • Android实战经验之如何使用DiffUtil提升RecyclerView的刷新性能
    本文首发于公众号“AntDream”,欢迎微信搜索“AntDream”或扫描文章底部二维码关注,和我一起每天进步一点点DiffUtil是一个用于计算两个列表之间差异的实用程序类,它可以帮助RecyclerView以更高效的方式更新数据。使用DiffUtil可以减少不必要的全局刷新,从而提高性能,特别是在处理......
  • 微服务jenkins解析部署使用全流程
    1、Jenkins1、什么是JenkinsJenkins是一个开源软件项目,是基于Java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个开放易用的软件平台,使软件项目可以进行持续集成。2、Jenkins的作用持续的软件版本发布/测试项目。监控外部调用执行的工作。(Jenkins有很多的插......
  • 【C++进阶】map和set的使用
    【C++进阶】map和set的使用......
  • Android实战经验之如何使用DiffUtil提升RecyclerView的刷新性能
    本文首发于公众号“AntDream”,欢迎微信搜索“AntDream”或扫描文章底部二维码关注,和我一起每天进步一点点DiffUtil是一个用于计算两个列表之间差异的实用程序类,它可以帮助RecyclerView以更高效的方式更新数据。使用DiffUtil可以减少不必要的全局刷新,从而提高性能,特......
  • 使用requests库发送get和post请求
    requests库是python的第三方模块,是一个简单易用的HTTP库,它允许发送HTTP/1.1请求,无需手工添加查询字符串或编码。需要在cmd里使用pipinstallrequests或在anacondaprompt中使用condainstallrequests命令安装。可以在官网查看详细信息:https://cookbook.openai.com/,在cmd中输入p......
  • Maven 使用方法
    MavenMaven是一个项目管理工具,它包含了一个项目对象模型(POM:ProjectObjectModel),其表现于一个XML文件(pom.xml),其中包含了项目的基本学习,依赖关系,插件配置,构建路径等等为什么使用Maven导入第三方jar包更便捷:之前我们在使用第三方框架时我们会把jar包复制粘贴到WE......
  • 使用vscode和markdown写博客
    Reason最近因为在做学校的实训项目,真正接触到了实际开发,遇到了不少的问题,由于之前也有在scdn上写博客的习惯(实际写的很乱,而且个人不是很喜欢csdn哈QAQ),所以想要重新维护一个规整的个人博客,于是此博客应允而出。Condition在了解之后,发现博客园的功能实在强大,而且大佬云集,也没有......
  • 【Java】了解线程 Thread 类的使用,
    线程是什么线程是操作系统中调度的基本单位,是比进程更小的执行单元。线程在进程内部运行,共享该进程的资源,如内存和文件句柄,但每个线程都有自己的执行栈和程序计数器。线程的主要特点包括:轻量级:线程相较于进程更加轻量,创建和销毁的开销较小。共享资源:同一进程中的线程共享该进程的内......
  • 混沌测试工具chaosblade 模拟磁盘 内存 CPU使用率
    一、简介ChaosBlade包含混沌工程实验工具chaosblade和混沌工程平台chaosblade-box。ChaosBlade的github项目地址,ChaosBlade主要包括以下几个组件:ChaosBlade-BoxConsole:ChaosBlade可视化组件,主要提供一套用户友好的Web界面,用户可以通过该界面进行混沌工程实验的编排与操作管......
  • Vue学习笔记6:分别使用纯JavaScript和Vue的v-if 指令来有条件地渲染网页元素
    0缘起有时我们的网页需要根据需要用户的选择展示不同的页面元素。例如:<p>你喜欢哪种水果?</p><p> <label> <inputtype="radio"value="苹果"name="fruit"/> 苹果 </label></p><p> <label> <inputtype="ra......