皆さま引き続きコロナには気をつけてお過ごしください！

【HTML/CSS】いろいろなリストを作ろう（文字編）

リスト HTML/CSS

 

前回、記号、数字を使った一覧表示の書き方をご紹介しました。

【HTML/CSS】いろいろなリストを作ろう（記号編）
ルビ表示切替 HTMLでただテキストをだらだら書いていると読みづらいと思います。 表や一覧形式を使うだけでも、読みやすくなりますよね。 今回は、HTMLで一覧表示をする方法や、 表示できる種類について...
nekopress.castelodelego.org
2021.05.30
【HTML/CSS】いろいろなリストを作ろう（数字編）
ルビ表示切替 前回、記号を使った一覧表示の書き方をご紹介しました。 今回は、数字を使って一覧表示する方法をご紹介したいと思います。 数字 数字と言っても、以下のようにいろいろな書き方が...
nekopress.castelodelego.org
2021.05.30

今回は、文字編です。

 

contents
  1. 文字を使った一覧表示
    1. ひらがな
    2. カタカナ
    3. いろは
    4. イロハ
    5. 日本語（敬語）
    6. 日本語（略式）
    7. 十二支
    8. 十干
    9. アルファベット
    10. アファル語
    11. アムハラ語（አማርኛ）
    12. アルメニア語（Հայերեն）
    13. CJK統合漢字
    14. ゲエズ語 / ゲーズ語 / 古代エチオピア語（ግዕዝ）
    15. グルジア語/ジョージア語/カルトリ語（ქართული ენა）
    16. ハングル
    17. カンナダ語（ಕನ್ನಡ）
    18. ギリシャ文字
    19. ノルウェー語
    20. オロモ語
    21. シダマ語 / シダーマ語 / シダモ語
    22. ソマリ語
    23. ティグレ語
    24. 簡体字
    25. 繁体字
    26. ウルドゥー語（اردو）
  2. まとめ
スポンサーリンク

文字を使った一覧表示

「文字」というと、どんな文字を思い浮かべますか？
日本語の文字には、ひらなが、カタカナ、漢字の3種類があります。
他にはアルファベットもありますね。

それぞれご紹介していきます。

ひらがな

IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”hiragana”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .hiragana {
  •     list-style-type: hiragana;
  • }

 

カタカナ

IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”katakana”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .katakana {
  •     list-style-type: katakana;
  • }

 

いろは

「いろは」は、
10世紀末から11世紀半ばの間に成立した「いろは歌うた」という、
仮名かなを重複ちょうふくさせずに使って作られた47字の誦文ずもんの一部です。
順番が決まっているため、一覧で使われることがあります。

IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”hiragana-iroha”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .hiragana-iroha {
  •     list-style-type: hiragana-iroha;
  • }

 

イロハ

IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”katakana-iroha”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .katakana-iroha {
  •     list-style-type: katakana-iroha;
  • }

 

日本語（敬語）

Firefoxのみサポートされています。 
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”japanese-formal”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .japanese-formal {
  •     list-style-type: japanese-formal;
  • }

 

日本語（略式）

Firefoxのみサポートされています。 
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”japanese-informal”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .japanese-informal {
  •     list-style-type: japanese-informal;
  • }

 

十二支

十二支じゅうにしは国によって若干じゃっかん違いますが、
ここでいう十二支は、日本で使われている動物です。
十二支

十二支 訓読み 音読み 動物 カナ
子 ね し 鼠 ネズミ
丑 うし ちゅう 牛 ウシ
寅 とら いん 虎 トラ
卯 う ぼう 兎 ウサギ
辰 たつ しん 龍 リュウ
巳 み し 蛇 ヘビ
午 うま ご 馬 ウマ
未 ひつじ び 羊 ヒツジ
申 さる しん 猿 サル
酉 とり ゆう 鶏 ニワトリ
戌 いぬ じゅつ 犬 イヌ
亥 い がい 猪 イノシシ
IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”cjk-earthly-branch”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .cjk-earthly-branch {
  •     list-style-type: cjk-earthly-branch;
  • }

 

十干

十干じっかんは、「甲・乙・丙・丁・戊・己・庚・辛・壬・癸」の10個の文字のことで、「甲乙丙丁こうおつへいてい」とも言います。

それぞれ、音読みと訓くん読みの2種類の読み方があります。

十干 音読み 訓読み
甲 コウ きのえ
乙 オツ きのと
丙 ヘイ ひのえ
丁 テイ ひのと
戊 ボ つちのえ
己 キ つちのと
庚 コウ かのえ
辛 シン かのと
壬 ジン みずのえ
癸 キ みずのと
IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”cjk-heavenly-stem”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .cjk-heavenly-stem {
  •     list-style-type: cjk-heavenly-stem;
  • }

 

アルファベット

大文字/小文字の2種類があります。

 

アルファベット（大文字）

2つの方法で記載できます。

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”upper-alpha”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .upper-alpha {
  •     list-style-type: upper-alpha;
  • }
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”upper-latin”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .upper-latin {
  •     list-style-type: upper-latin;
  • }

 

アルファベット（小文字）

2つの方法で記載できます。

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”lower-alpha”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .lower-alpha {
  •     list-style-type: lower-alpha;
  • }
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”lower-latin”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .lower-latin {
  •     list-style-type: lower-latin;
  • }

 

アファル語

アファル語は、エチオピア、エリトリア、ジブチに話者がいる低地ていち東クシ語に属ぞくする言語です。

Safariでのみサポートされています。 

Afar in Ethiopia

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”afar”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .afar {
  •     list-style-type: afar;
  • }

 

アムハラ語（አማርኛ）

アムハラ語は、エチオピアの事実上の公用語です。
2種類の記載方法があります。

Safariでのみサポートされています。 

Amhara in Ethiopia

アムハラ語の一覧はwikiご参照

 

アムハラ語

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”amaric”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .amaric {
  •     list-style-type: amaric;
  • }

 

アムハラ語(abegede)

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”amaric-abegede”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .amaric-abegede {
  •     list-style-type: amaric-abegede;
  • }

 

アルメニア語（Հայերեն）

アルメニア語はアジアとヨーロッパの間にあるコーカサス山岳地帯さんがくちたいにあるアルメニアという国で使われている言語です。

カフカス地方の一国アルメニアの公用語。

IE（Internet Explorer）ではサポートされていません。

Armenia (orthographic projection)

アルメニア語（大文字）

画面表記 HTMLコード CSS
  • 1番目
  • 2番目
  • 3番目
  • <ol class=”upper-armenian”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .upper-armenian {
  •     list-style-type: upper-armenian;
  • }

 

アルメニア語（小文字）

画面表記 HTMLコード CSS
  • 1番目
  • 2番目
  • 3番目
  • <ol class=”lower-armenian”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .lower-armenian {
  •     list-style-type: lower-armenian;
  • }

 

CJK統合漢字

ISO/IEC 10646およびUnicodeにて採用されている符号化用ふごうかよう漢字集合およびその符号表。
中国語、日本語、朝鮮ちょうせん語 で使われている漢字をひとまとめにしたものです。

IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”cjk-ideographic”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .cjk-ideographic {
  •     list-style-type: cjk-ideographic;
  • }

 

ゲエズ語 / ゲーズ語 / 古代エチオピア語（ግዕዝ）

エチオピアおよびエリトリアの古典語です。
話し言葉として消滅しょうめつした後、キリスト教の典礼てんれい言語および公式の文章語として使われ続けたようです。

Ethiopic genesis (ch. 29, v. 11-16), 15th century (The S.S. Teacher's Edition-The Holy Bible - Plate XII, 1)

ゲエズ語

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic {
  •     list-style-type: ethiopic;
  • }

 

ゲエズ語（abegede）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-abegede”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-abegede {
  •     list-style-type: ethiopic-abegede;
  • }

 

ゲエズ語（abegede-am-et）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-abegede-am-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-abegede-am-et {
  •     list-style-type: ethiopic-abegede-am-et;
  • }

 

ゲエズ語（abegede-gez）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-abegede-gez”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-abegede-gez {
  •     list-style-type: ethiopic-abegede-gez;
  • }

 

ゲエズ語（abegede-ti-er）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-abegede-ti-er”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-abegede-ti-er {
  •     list-style-type: ethiopic-abegede-ti-er;
  • }

 

ゲエズ語（abegede-ti-et）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-abegede-ti-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-abegede-ti-et {
  •     list-style-type: ethiopic-abegede-ti-et;
  • }

 

ゲエズ語（halehame）

IE（Internet Explorer）とSafariではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame {
  •     list-style-type: ethiopic-halehame;
  • }

 

ゲエズ語（halehame-aa-er）

Safariでのみサポートされています。 
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-aa-er”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-aa-er {
  •     list-style-type: ethiopic-halehame-aa-er;
  • }

 

ゲエズ語（halehame-aa-et）

Safariでのみサポートされています。 
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-aa-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-aa-et {
  •     list-style-type: ethiopic-halehame-aa-et;
  • }

 

ゲエズ語（halehame-am）

IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-am”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-am {
  •     list-style-type: ethiopic-halehame-am;
  • }

 

ゲエズ語（halehame-am-et）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-am-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-am-et {
  •     list-style-type: ethiopic-halehame-am-et;
  • }

 

ゲエズ語（halehame-gez）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-gez”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-gez {
  •     list-style-type: ethiopic-halehame-gez;
  • }

 

ゲエズ語（halehame-om-et）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-om-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-om-et {
  •     list-style-type: ethiopic-halehame-om-et;
  • }

 

ゲエズ語（halehame-sid-et）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-sid-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-sid-et {
  •     list-style-type: ethiopic-halehame-sid-et;
  • }

 

ゲエズ語（halehame-so-et）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-so-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-so-et {
  •     list-style-type: ethiopic-halehame-so-et;
  • }

 

ゲエズ語（halehame-ti-er）

IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-ti-er”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-ti-er {
  •     list-style-type: ethiopic-halehame-ti-er;
  • }

 

ゲエズ語（halehame-ti-et）

IE（Internet Explorer）ではサポートされていません。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-ti-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-ti-et {
  •     list-style-type: ethiopic-halehame-ti-et;
  • }

 

ゲエズ語（halehame-tig）

Safariでのみサポートされています。 
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”ethiopic-halehame-tig”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .ethiopic-halehame-tig {
  •     list-style-type: ethiopic-halehame-tig;
  • }

 

グルジア語/ジョージア語/カルトリ語（ქართული ენა）

南コーカサスにあるジョージアの公用語です。
დამწერლობა

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”georgian”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .georgian {
  •     list-style-type: georgian;
  • }

 

ハングル

IE（Internet Explorer）ではサポートされていません。

ハングル

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”hangul”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .hangul {
  •     list-style-type: hangul;
  • }

 

ハングル（子音）

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”hangul-consonant”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .hangul-consonant {
  •     list-style-type: hangul-consonant;
  • }

 

カンナダ語（ಕನ್ನಡ）

カンナダ語は南インド4州の一つ、カルナータカ州の公用語。
ドラヴィダ語族の中でもっとも古い言語の一つです。

IE（Internet Explorer）ではサポートされていません。

Kannadaspeakers

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”kannada”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .kannada {
  •     list-style-type: kannada;
  • }

 

ギリシャ文字

Greekalphabet

ギリシャ語（大文字）

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”upper-greek”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .upper-greek {
  •     list-style-type: upper-greek;
  • }

 

ギリシャ文字（小文字）

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”lower-greek”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .lower-greek {
  •     list-style-type: lower-greek;
  • }

 

ノルウェー語

Safariでのみサポートされています。

ノルウェー語（大文字）

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”upper-norwegian”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .upper-norwegian {
  •     list-style-type: upper-norwegian;
  • }

 

ノルウェー語（小文字）

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”lower-norwegian”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .lower-norwegian {
  •     list-style-type: lower-norwegian;
  • }

 

オロモ語

オロモ語はエチオピアとケニアにいる2500万人のオロモ人やその近隣きんりんのウェルジ人などの第一言語です。

Safariでのみサポートされています。

Oromia in Ethiopia

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”oromo”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .oromo {
  •     list-style-type: oromo;
  • }

 

シダマ語 / シダーマ語 / シダモ語

シダマ語はシダマ民族みんぞくの言語で、エチオピアの南部諸民族しょみんぞく州の主要言語です。

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”sidama”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .sidama {
  •     list-style-type: sidama;
  • }

 

ソマリ語

ソマリア、ソマリランド、エチオピアのソマリ州、ジブチ、ケニア北東部で話される言語です。

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”somali”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .somali {
  •     list-style-type: somali;
  • }

 

ティグレ語

エリトリア北部で使われる言語です。

ティグレ語

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”tigre”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .tigre {
  •     list-style-type: tigre;
  • }

 

ティグレ語（er）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”tigrinya-er”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .tigrinya-er {
  •     list-style-type: tigrinya-er;
  • }

 

ティグレ語（er-abegede）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”tigrinya-er-abegede”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .tigrinya-er-abegede {
  •     list-style-type: tigrinya-er-abegede;
  • }

 

ティグレ語（et）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”tigrinya-et”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .tigrinya-et {
  •     list-style-type: tigrinya-et;
  • }

 

ティグレ語（et-abegede）

Safariでのみサポートされています。
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”tigrinya-et-abegede”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .tigrinya-et-abegede {
  •     list-style-type: tigrinya-et-abegede;
  • }

 

簡体字

IE（Internet Explorer）とSafariではサポートされていません。

簡体字（公的）

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”simp-chinese-formal”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .simp-chinese-formal {
  •     list-style-type: simp-chinese-formal;
  • }

 

簡体字

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”simp-chinese-informal”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .simp-chinese-informal {
  •     list-style-type: simp-chinese-informal;
  • }

 

繁体字

IE（Internet Explorer）とSafariではサポートされていません。

繁体字（公的）

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”trad-chinese-formal”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .trad-chinese-formal {
  •     list-style-type: trad-chinese-formal;
  • }

 

繁体字

画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”trad-chinese-informal”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .trad-chinese-informal {
  •     list-style-type: trad-chinese-informal;
  • }

 

ウルドゥー語（اردو）

パキスタンの国語、インドの主要言語の1つとして使われている言語です。

IE（Internet Explorer）ではサポートされていません。 
画面表記 HTMLコード CSS
  1. 1番目
  2. 2番目
  3. 3番目
  • <ol class=”urdu”>
  •  <li>1番目</li>
  •  <li>2番目</li>
  •  <li>3番目</li>
  • </ol>
  • .urdu {
  •     list-style-type: urdu;
  • }

 

スポンサーリンク

まとめ

ブラウザによっては表示でできない言語が多く、
また実際に使うことはほぼないかもしれませんが、
いろいろな言語があることをリストを通して知ることができるのは面白いですね。

なお、各スタイルのブラウザごとの使用可否は、以下サイトを参照させていただいています。

list-style-type - CSS: カスケーディングスタイルシート | MDN
list-style-type は CSS のプロパティで、リスト項目要素のマーカーを設定します (円、文字、独自のカウンタースタイルなど)。
developer.mozilla.org
スポンサーリンク

コメント

ホーム
トップ
タイトルとURLをコピーしました