ol {
padding: 0;
margin: 0;
list-style: none;
counter-reset: sectioncounter
}
ol > li{
width: 100%;
line-height: 30px;
color: #130b18;
font-size: 1.4rem;
}
ol > li:before {
content: '' counter(sectioncounter) '';
counter-increment: sectioncounter;
width: 18px;
height: 18px;
line-height: 18px;
text-align: center;
display: inline-block;
background-color: #e3c690;
color: #bc8011;
font-size: 1.4rem;
border-radius: 50%;
margin-right: 2%;
}
- counter-reset 屬性設置某個選擇器出現次數的計數器的值。默認爲 0。
- counter-increment 屬性設置某個選取器每次出現的計數器增量。默認增量是 1。
.list{
counter-reset:section 1;
}
.list p:before{
content: counter(section) '. ';
counter-increment: section;
}
.list p{
counter-reset:subCounter;
}
.list span{
display: block;
margin-left: 3%;
}
.list span:before{
content: counter(section) '.' counter(subCounter) ' ';
counter-increment: subCounter;
background-color: #2AC845;
color: #fff;
}