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

使用css3实现文章新闻列表排行榜(数字)_html/css_WEB-ITnose

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

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

一:使用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

人气教程排行