list-style-typeとは
リスト項目要素のマーカーのことですね。
- 👈これとか
- 👈これとか
hiragana-irohaやcjk-earthly-branchなど、使い所があまりないけれど、知識としては面白いプロパティもあるので、ドキュメントを読んでみることをオススメします。
🥺が出るようにしたい
さて、本題ですが、list-style-typeは規定値としてdiscが設定されています。
そのため、デフォルトのスタイルでは●がでることでしょう。
これを🥺に変えるには、値にUnicodeを設定します。
🥺はU+1F97Aのため、次のようにします。
HTML
<ul>
<li>ぴえん</li>
<li>ぴえん</li>
</ul>
CSS
ul {
list-style-type: "\1F97A";
}
これで🥺をlist-style-typeで使うことができます。
ちなみに💩はU+1F4A9ですので、💩を出したいは次のようにします。
CSS
ul {
list-style-type: "\1F4A9";
}
また、HTML上で🥺や💩を文字として使いたい場合は、数値文字参照を使うことでデバイス間による文字化けを防ぐことができます。
HTML
<!--ぴえん-->
<p>🥺</p>
<!--うんち-->
<p>💩</p>
参照
絵文字のUnicodeと数値文字参照がまとめられていて、分かりやすかったです。
https://lets-emoji.com/