内容引用自《css世界》：

  • count-reset 与 counter 为父子关系，兄弟关系会导致序号混乱
  • 调用一次 count-increment 将给序号进行一次报数，调用 counter 时将显示新的报数。
<!DOCTYPE html>

<html>

<head>

<style>

.reset {

  padding-left: 20px;

  counter-reset: wangxiaoer;

}

.counter:before {

  content: counters(wangxiaoer, '-') '. ';

  counter-increment: wangxiaoer;

}

</style>

</head>

<body>

<div class="reset">

    <div class="counter">我是王小二

        <div class="reset">

            <div class="counter">我是王小二的大儿子</div>

            <div class="counter">我是王小二的二儿子

                <div class="reset">

                    <div class="counter">我是王小二的二儿子的大孙子</div>

                    <div class="counter">我是王小二的二儿子的二孙子</div>

                    <div class="counter">我是王小二的二儿子的小孙子</div>

                </div>

            </div>

            <div class="counter">我是王小二的三儿子</div>

        </div>

    </div>

    <div class="counter">我是王小三</div>

    <div class="counter">我是王小四

        <div class="reset">

            <div class="counter">我是王小四的大儿子</div>

        </div>

    </div>

</div>

</body>

</html>

[TimLinux] CSS 计数功能实现递归目录的更多相关文章

  1. 脉冲计数功能在ESM335x-Linux主板上的实现

    1.综述 在工业控制中,经常需要获取脉冲信号计数值.频率.周期.占空比等参数.英创嵌入式主板ESM335X系列 Linux系统现已实现外部输入脉冲信号的计数.频率.周期.占空比测量功能. 主要功能及技 ...

  2. TF：Tensorflow定义变量+常量,实现输出计数功能—Jason niu

    #TF:Tensorflow定义变量+常量,实现输出计数功能 import tensorflow as tf state = tf.Variable(0, name='Parameter_name_c ...

  3. 相似group by的分组计数功能

    之前同事发过一个语句,实现的功能比較简单,相似group by的分组计数功能,由于where条件有like,又无法用group by来实现. SELECT a.N0,b.N1,c.N2,d.N3,e. ...

  4. svn add 命令 递归目录下所有文件

    svn add 命令 递归目录下所有文件 摘自:https://blog.csdn.net/yefl007/article/details/46506281 即使被忽略了也可以使用此命令. svn a ...

  5. stm32定时器计数功能

    stm32的外部时钟源模式2和外部时钟源模式1都可以用来实现计数功能,他们的区别是什么呢? 以上2种模式对应不同的管脚输入: 外部时钟源模式2 <-->TIMx_ETR 外部时钟源模式1  ...

  6. [TimLinux] CSS 纯CSS实现动画展开/收起功能

    内容转自CSS世界,理解之后进行了简化,简化后代码: <!DOCTYPE html> <html> <head> <meta charset=utf-8 /& ...

  7. python找递归目录中文件，并移动到一个单独文件夹中，同时记录原始文件路径信息

    运营那边有个需求. 下载了一批视频文件,由于当时下载的时候陆陆续续创建了很多文件夹,并且,每个文件夹下面还有子文件夹以及视频文件,子文件夹下面有视频文件或者文件夹 现在因为需要转码,转码软件只能对单个 ...

  8. ActiveReports 9 新功能：借助目录(TOC)控件为报表添加目录功能

    在最新发布的ActiveReports 9报表控件中添加了多项新功能,以帮助你在更短的时间里创建外观绚丽.功能强大的报表系统,本文将重点介绍新增文档目录控件(TOC),通过拖拽操作便可添加报表目录. ...

  9. 递归目录的shell脚本

    #! /bin/sh # 在其他目录运行时一定要加上这样的语句 # 尤其是配置在crontab里自动运行 cd `` #定义数据别名 alias statdb="/usr/local/mys ...

随机推荐

  1. day2-day3基本数据类型专区

    一.基本数据类型 1.字符串 str (用''or“”表示) 字符串中每个组成部分为字符,python中只要是用引号引起来的都叫字符串 ---特征: 加法 n1 = "alex" ...

  2. Spring中常用的注解及作用

    @Component(value) 配置类,当使用该注解时,SpringIOC会将这个类自动扫描成一个bean实例 不写的时候,默认是类名,且首字母小写 @ComponentScan 默认是代表进行扫 ...

  3. 手把手教你实现热更新功能，带你了解 Arthas 热更新背后的原理

    文章来源:https://studyidea.cn/java-hotswap 一.前言 一天下午正在摸鱼的时候,测试小姐姐走了过来求助,说是需要改动测试环境 mock 应用.但是这个应用一时半会又找不 ...

  4. 【Java】抽象类和接口详解

    抽象类 一.抽象类的概述 现在请思考一个问题:假如我现在又Dog.Cat.Pig等实例对象,现在我们把它们都抽象成一个Animal类,这个类应该包含了这些Dog.Cat.Pig等实例对象eat的功能, ...

  5. mysql注意：

    本例测试数据表 CREATE TABLE `test_student` ( `id` int(11) unsigned NOT NULL AUTO_INCREMENT COMMENT '主键自增id' ...

  6. 彻底搞懂CSS伪类选择器：is、not

    本文介绍一下Css伪类:is和:not,并解释一下is.not.matches.any之前的关系 :not The :not() CSS pseudo-class represents element ...

  7. HTML_本地存储

    在HTML5当中,新增了很多的存储方式,这里我先介绍两种,方便我们的使用和操作,具体新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问 ...

  8. 解决无法定位软件包 或 install net-tools

    解决无法定位软件包  或  install net-tools  当我们安装好Linux后,因为里面有很多功能服务没有安装(如ifconfig.vsftpd) 所以出现一些command  '**** ...

  9. Python 编程语言要掌握的技能之一：使用数字与字符串的技巧

    最佳实践 1. 少写数字字面量 “数字字面量(integer literal)” 是指那些直接出现在代码里的数字.它们分布在代码里的各个角落,比如代码 del users[0] 里的 0 就是一个数字 ...

  10. nmap中的详细命令

    nmap全部参数详解-A 综合性扫描端口:80http 443https 53dns 25smtp 22ssh 23telnet20.21ftp 110pop3 119nntp 143imap 179 ...