Cocoonリストのマーカー(点)の色を変えるカスタマイズ

Cocoonリストの点の色を変更するカスタマイズカスタマイズ
この記事は約1分で読めます。

Cocoonリストのマーカー(点)の色を変える方法を紹介していきます。

こんな見た目になります

リストカスタマイズ

点に色がついて、かわいらしい印象になると同時にリストが目立ちやすくなります。

カスタマイズの手順:CSSのコピペだけ

追加CSSに、以下のコードをコピペするだけで完成します。

カラーコードは、適宜お好きな色に変えて使ってください。

カスタマイズ用コード

/* list */
.article ul li, .article ol li {
	list-style: none;
}
.article ul li:before, .article ol li:before {
	content: '';
	position: relative;
	top: -2px;
	display: inline-block;
	width: 8px; /* 点の幅 */
	height: 8px; /* 点の高さ */
	border-radius: 50%;
	background: #ffb1d8; /* リストの前の点の色 */
	margin-right: .5em;
	padding-right:0;
}

コメント

タイトルとURLをコピーしました