zoukankan      html  css  js  c++  java
  • counter 计数器

    包含了两个属性和一个方法:

    1. counter-reset
    2. counter-increment
    3. counter()/counters()
     
    counter-reset(主要作用就是给计数器起个名字。如果可能,顺便告诉下从哪个数字开始计数。默认是0):
    .xxx { counter-reset: small-apple; }              /* 计数器名称是'small-apple' ,用来*/
    .xxx { counter-reset: small-apple 2; }           /* 计数器名称是'small-apple', 并且默认起始值是2 */
    可以多个计时器同时命名:
    .xxx { counter-reset: wangxiaoer 2 wangxiaosan 3; }
    counter-reset还可以设置为none和inherit. 干掉重置以及继承重置。
     
    counter-increment(counter递增幅度,默认变化值1,也可以是负数):
    .counter { counter-reset: wangxiaoer 2; counter-increment: wangxiaoer; }
    .counter:before { content: counter(wangxiaoer); }
    <p class="counter"></p>
    counter-increment会叠加,例如before和after都用了:
    .counter { counter-reset: wangxiaoer 2; }
    .counter:before,.counter:after { content: counter(wangxiaoer); counter-increment: wangxiaoer; }
    结果输出:34
    也可以同时设置多个定时器的:
    counter-increment: test 1 lala 2;
     
    counter()/counters()  (这是个方法,不是属性。类似CSS3中才calc()计算):
    1、counter(name) /* name就是counter-reset的名称 */
    2、counter(name, style)
    style,其支持的关键字值就是list-style-type支持的那些值:disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none | armenian | cjk-ideographic | georgian | lower-greek | hebrew | hiragana | hiragana-iroha | katakana | katakana-iroha | lower-latin | upper-latin
     
  • 相关阅读:
    表单数据源控制器笔记
    方法汇总1
    Persistence.beans
    数据库外键理解
    SQL语句缺少
    树型结构需要绑定的字段
    模型绑定替换
    乱码
    表单的验证:客户端验证和服务器端验证
    表单
  • 原文地址:https://www.cnblogs.com/chuangweili/p/5167976.html
Copyright © 2011-2022 走看看