门户网站设计技巧,智能管理系统软件,wordpress答题跳转,江苏网站建设网站排名优化概念 CSS3计数器#xff08;CSS Counters#xff09;可以允许我们使用css对页面中的任意元素进行计数#xff0c;实现类似于有序列表的功能#xff08;自定义有序列表#xff09; 与有序列表相比#xff0c;它的突出特性在于可以对任意元素计数#xff0c;同时实现个性化…概念 CSS3计数器CSS Counters可以允许我们使用css对页面中的任意元素进行计数实现类似于有序列表的功能自定义有序列表 与有序列表相比它的突出特性在于可以对任意元素计数同时实现个性化计数 使用计数器步骤 定义计数器设置计数器的增数规则自定义列表样式调用计数器计数器属性 counter-reset定义计数器包括初始值、作用域等counter-increment设置计数器的增数规则一般都是用默认即值只设置了计数器名称未设置增数规则counter()/counters()在content属性中使用用来调用计数器counter-style自定义列表样式counter-reset语法 counter-reset:[identifierinteger?]|none|inherit 用来定义计数器的名称、初始值和作用域默认值为none identifier计数器名称 integer计数器的初始值可以不写默认为0 注意当元素display为none时该属性失效 counter-increment语法 counter-increment:[user-identinteger?]|none 用来设置计数器的增数规则默认值为none阻止计数器增加 user-ident需要增数的计数器名称 integer计数器增数的值可以为负值默认是1 我们可以同时设置多个计数器增数规则 注意当元素display为none时该属性失效 counter()语法 content:[counter] countercounter(name)| 直接调用计数器名称 可得到1,2,3 counter(name,list-style-type)| 调用计数器名称并指定计数器列表样式 counters()语法 content:[counter] countercounters(name,string)| 嵌套计数器时设置间隔的字符串 可得到1.1,1.2,1.3 counters(name,string,list-style-type) 嵌套计数器时设置间隔字符串并指定样式 注意使用计数器需要结合before和after使用。可以同时使用多个计数器 counter-style语法 counter-style counterStyleName{ system算法 range使用范围 symbols/ additive-symbols符号 prefix前缀 suffix后缀 pad补零 negative负数策略 fallback出错后的默认值 speakas语音策略 } 计数器demo转载于:https://www.cnblogs.com/xiaobaizhiqian/p/8324858.html