兜兜转转,回归初恋,欢迎使用yusiyuhuo主题, 主题介绍>>>

css如何给li标签前添加数字

WordPress基础教程 陌小雨 6034℃ 0评论

wordpress网址导航主题wpsite-p用到了这个办法,可以使li标签前添加逐渐增加的数字,1、2、3、4、5这样子分线给大家:

.head_new ul{counter-reset:sectioncounter;}
.head_new ul li:before {
    display: inline-block;
    content: counter(sectioncounter);
    counter-increment: sectioncounter;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    margin-right: 1em;
    background: #5bc648;
    color: #efe;
    font-size: 14px;
}

效果:wpsite-p网址导航主题

转载请注明:小雨科技 _武汉网站建设_武汉小程序搭建 » css如何给li标签前添加数字

喜欢 (0)
发表我的评论
取消评论
表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址