css 订购列表的自定义计数器

Posted 2021-05-13

ol.custom-counter {
	margin: 1em 0 1em 2em;
	padding: 0;
	list-style-type: none;
}
	ol.custom-counter li {
		position: relative;
		counter-increment: step-counter;
		margin-bottom: .5em;
	}
	ol.custom-counter li::before {
		position: absolute;
		content: counter(step-counter);
		left: -2.5em;
		top: 0;
		font-size: .8em;
		background-color: #84B962;
		color: #fff;
		font-weight: bold;
		padding: 3px 8px;
		border-radius: 3px;
	}