当前位置:Gxlcms > html代码 > 使用css3实现文章新闻列表排行榜(数字)

使用css3实现文章新闻列表排行榜(数字)

时间:2021-07-01 10:21:17 帮助过:75人阅读

列举几个简单的文章排行榜数字效果

一:使用list-style来显示数字、圆点、字母或者图片


  • 文章1
  • 文章2

二:使用伪元素:before

使用这种方法,需要在父级标签设置counter-reset:section;


  • 文章1
  • 文章2
  • 文章3
  • 文章4

三:使用js实现,先引入jquery


  • 文章1
  • 文章2
  • 文章3
  • 文章4

比较三种方法,无论是从代码量、还是特效,推荐第二种方法,而且便以维护

地址:http://cssteach.com/html/show-12-88.html

人气教程排行