伪类模仿 li 前面的圆点及各种符号
来源:互联网 发布:赛扬n3150能否优化 编辑:程序博客网 时间:2024/05/01 00:14
项目里有个需求就是改变li前面圆点的颜色 ,然后上网查了一下,看到知乎上有位大神提供的方法,伪类!
代码片
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>css模仿li圆点</title> <style> ul { list-style: none; margin: 0 auto; padding: 0; width: 100px; } li:before { content: "❤ "; color: red; } </style></head><body> <ul> <li>123</li> <li>123</li> <li>123</li> <li>123</li> </ul></body></html>
代码就是上面的,核心部分
li:before { content: "❤ "; color: red; }
利用:before伪类在li前面插入符号图标,设定颜色就可以了!
另外我在网上还查了一份图标大全分享一下:字体图标地址链接
0 0
- 伪类模仿 li 前面的圆点及各种符号
- 如何将li的前面那个圆点去掉
- HTML5 ul li 去前面的圆点 和 横排
- css去掉li标签前面的点
- CSS去掉li中前面的点
- 如何动态显示li前面的点
- 怎么去掉li、ul等前面的点及如何去掉空格的方法
- 【html/css】CSS中去掉li前面的圆点方法
- CSS中不显示li前面的点
- css中li前面点的样式或换成图片
- li 的圆点失效
- HTML 去除 li 前面的小黑点及 ul、li 部分属性介绍
- 伪符号及条件断点的使用
- 关于li:hover伪类,以及各种除了a:hover在IE6下不生效的解决办法.
- DIV+CSS如何控制html标签li的样式,比如删除前面的点
- 关于去掉Li标签前面的小圆点和距离/显示下划线
- list_style li 的点
- 设置li前面的方块大小
- Android自定义View系列笔记收录
- [LeetCode] 38. Count and Say java
- [LeetCode] 438. Find All Anagrams in a String java
- [绍棠] ERROR ITMS-90206:"Invalid Bundle. The bundle at 'XXX.appex' contains disallowed file 'Framework
- 1 冒泡排序
- 伪类模仿 li 前面的圆点及各种符号
- java常用术语
- Spring源码解析-applicationContext
- WinInet:HTTPS 请求出现无效的证书颁发机构的处理
- [LeetCode] 49. Group Anagrams java
- WEB Service配置
- datepicker 设置默认日期
- AngularJS开发前端表格组件
- 算法笔记_061-蓝桥杯练习 字串统计(Java)