关于自定义list-style-type的样式和颜色

css提供了列表标签li,通过list-style-type属性可以设置列表项标记的类型。例如:disc、circle、square、decimal等。

那如何自定义标记的类型呢?

li::before{
  content:"★";
  color:blue;
  font-size:30px;
}

通过如上代码可以显示
这样只需要通过改变content内容即可替换其他各种标记形状了,color可以控制标记的颜色,font-size可以控制标记的大小。
当然也可以通过添加图片来增加更复杂的标记的形状:
li::before{
  content:url(edit.png);
  font-size:30px;
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,089评论 0 1
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,025评论 25 708
  • 2014年的苹果全球开发者大会(WWDC),当Craig Federighi向全世界宣布“We have new ...
    yeshenlong520阅读 2,311评论 0 9
  • 日光下是沉郁的深黄色沙漠。 仿佛发出耀眼白光的黄色沙砾绵延到时间和空间的尽头。 沙丘大起大落,只有沙漠的腹地有白...
    Ocnos阅读 396评论 0 0
  • 风格养成之路 先了解喜好再去探索风格 文原创优雅管理 风格养成的密码揭示,当你看起来无比的有吸引力,却简洁得没有任...
    印象管理阅读 472评论 0 1