::marker是什么
::marker是css伪元素，可以用在li元素或设置了display:list-item的元素上，自定义项目符或者数字的样式。
::marker允许的属性值
::marker只能使用以下css属性：
- font属性
- color属性
- content属性
- text-combine-upright，unicode-bidi和direction属性
::marker使用示例
改变项目符/数字颜色
#ul1 li::marker{
color: red;
font-size: 1.5em;
}
#ul2 li::marker{
color: blue;
font-size: 1em;
}
<ul id="ul1">
<li>现场:解放军霸气喊话驱离美军机</li>
<li>高考移民考入复旦被开除后起诉学校</li>
<li>拜登:将国家紧急状态延长一年</li>
<li>货拉拉乘客坠亡案被告人已签认罪书</li>
</ul>
<ol id="ul2">
<li>现场:解放军霸气喊话驱离美军机</li>
<li>高考移民考入复旦被开除后起诉学校</li>
<li>拜登:将国家紧急状态延长一年</li>
<li>货拉拉乘客坠亡案被告人已签认罪书</li>
</ol>
改变项目符的图标
li::marker{
content: '🧡 '
}
自定义display:list-item的元素的项目符
#ul4{
margin-left: 40px;
font-size: 14px;
}
h3 {
counter-increment: h3;
display: list-item;
}
h3::marker {
display: list-item;
content: "#"counter(h3) " ";
color: lightsalmon;
font-weight: bold;
}
<div id="ul4">
<h3>现场:解放军霸气喊话驱离美军机</h3>
<h3>高考移民考入复旦被开除后起诉学校</h3>
<h3>拜登:将国家紧急状态延长一年</h3>
<h3>货拉拉乘客坠亡案被告人已签认罪书</h3>
</div>
