使用::marker伪元素可自定义列表项目符号样式，支持color、font-size等属性；通过li::marker可修改颜色大小，结合list-style: none与::before可自定义无序符号，配合CSS计数器能实现高级有序列表样式，提供比list-style-type更精细的视觉控制。
使用 ::marker 伪元素可以轻松自定义有序列表（
<ol>
<ul>
<li>
::marker 是一个伪元素，可以直接在 CSS 中为
li
注意：不能通过 ::marker 设置背景图或复杂内容，某些属性如 width、margin 等也不支持。
你可以调整列表符号的颜色和字体大小，使其更符合页面设计风格：
立即学习“前端免费学习笔记（深入）”；
li::marker {
color: #e74c3c;
font-size: 1.2em;
font-weight: bold;
}
这段代码会让所有
li
虽然不能直接用 content 替换符号（目前多数浏览器尚未支持），但可以通过其他方式模拟。例如隐藏原有符号并用 ::before 添加自定义内容：
ul li {
list-style: none; /* 去掉默认符号 */
}
<p>ul li::before {
content: "• ";
color: blue;
font-size: 1.3em;
margin-left: -1em;
}</p>这种方法适用于需要完全控制符号样式的场景。
对于
<ol>
ol {
counter-reset: section;
}
<p>ol li {
counter-increment: section;
}</p><p>ol li::marker {
color: purple;
font-weight: bold;
}</p>这样依然保留原有编号逻辑，同时美化显示样式。
基本上就这些。::marker 提供了比传统
list-style-type
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
577
收藏
