カテゴリー: ホームページ

カテゴリー
ホームページ

箇条書きマークの操作

段落<p>の先頭に”●（くろまる）”をつける

こんな感じ

2023年度の計画の実行

HTML

<div class="kuromaru">
	<p>2023年度の計画の実行</p>
</div>

css

.kuromaru p {padding-left: 1.0rem;}
.kuromaru::before {content: "●"; margin-left: -1.0rem;}

箇条書き<li>の先頭に”※（こめじるし）”をつける

こんな感じ

  • SNSなどの活用

HTML

<div class="komekome">
	<ul>
		<li>SNSなどの活用</li>
	</ul>
</div>

css

.komekome ul {margin:0; padding:0;}
.komekome ul li {list-style-type: none; padding-left: -1.3em; text-indent: -1.3em;}
.komekome ul li::before {content: "※";}
カテゴリー
ホームページ

リストの先頭文字に丸数字を表示する

丸数字を環境依存文字で書いて表示する

こんな感じ

  1. ①　リスト１
  2. ②　リスト２
  3. ③　リスト３
  4. ④　リスト４

環境文字のコードは、次のとおり

丸数字

コード

①

＆＃９３１２；

②

＆＃９３１３；

③

＆＃９３１４；

④

＆＃９３１５；

HTML

<ol>
　<li>＆#9312;　リスト１</li>
　<li>＆#9313;　リスト２</li>
　<li>＆#9314;　リスト３</li>
　<li>＆#9315;　リスト４</li>
</ol>

css

ol {margin:0; padding:0;}
ol li {list-style:none; padding-left:1.3em; text-indent: -1.3em;}