• 首页
  • css3教程
  • html5教程
  • jQuery手册
  • php7教程
  • MySQL手册
  • apache手册
  • counter-increment

    版本:CSS3

    counter-increment属性用于将CSS Counters的值增加给定值。可以使用 counter-reset 属性重置计数器的值。

    示例

    /* Increment counter-name by 1 */
    counter-increment: counter-name;
    
    /* Decrement counter-name by 1 */
    counter-increment: counter-name -1;
    
    /* Increment counter1 by 1, and decrement counter2 by 4 */
    counter-increment: counter 1 counter2 -4;
    
    /* Do not increment/decrement anything: used to hide less specific values */
    counter-increment: none;
    
    /* Global values */
    counter-increment: inherit;
    counter-increment: initial;
    counter-increment: unset;
    

    浏览器支持

    IE浏览器火狐浏览器opera浏览器chrome浏览器safari浏览器
    IE8以上版本的浏览器都支持counter-increment

    语法

    counter-increment:[<custom-ident><integer>?]+| none

    取值

    • <custom-ident>:递增的计数器的名称。该标识符由不区分大小写的字母a~z,数字0~9,下划线(_)和/或短划线(-)的组合组成。第一个非破折号字符必须是一个字母(即,在它的开头没有数字,即使前面有破折号。)此外,在标识符的开头禁止使用两个破折号。在任何案例组合中都不能是noneunsetinitialinherit
    • <integer>:计数器的值。如果没有给出,默认为1。
    • none:不得增加计数器。用作默认值,或取消更具体规则的增量。

    你可以根据需要指定要递增的计数器,每个计数器用空格分隔。

    实例

    h1 {
      counter-increment: chapter section 2 page;
      /* Increases the value of the chapter and page counters by 1
         and the section counter by 2. */
    }
    

    上篇:counters()

    下篇:@counter-style