::mark伪元素基本使用示意实例页面

展示

改变默认有序序号样式

有序列表
看看序号的粗细
看看序号的颜色？

自定义项目符号

summary元素有自己的marker伪元素

代码

HTML：

<h4 class="fill">改变默认有序序号样式</h4>
    <ol>
        <li>有序列表</li>
        <li>看看序号的粗细</li>
        <li>看看序号的颜色？</li>
    </ol>
    
    <h4 class="fill">自定义项目符号</h4>
    <div class="marker">summary元素有自己的marker伪元素</div>

CSS：

li::marker {
    color: deepskyblue;
    font-weight: bold;
}

div.marker {
    display: list-item;
    margin-left: 1em;
    padding-left: 5px;
}
div.marker::marker {
    content: "▶";
}