「利用者:Fet-Fe」の版間の差分
ナビゲーションに移動
検索に移動
→順序付きリスト
>Fet-Fe 細 (→順序付きリスト) |
>Fet-Fe |
||
712行目: | 712行目: | ||
利用できる番号の一覧はMozillaの[https://developer.mozilla.org/ja/docs/Web/CSS/list-style-type list-style-type]のページから確認できる。 | 利用できる番号の一覧はMozillaの[https://developer.mozilla.org/ja/docs/Web/CSS/list-style-type list-style-type]のページから確認できる。 | ||
以下の例では、<code><ol style="list-style-type: tibetan; column-count: 2;"></code> | 以下の例では、<code><ol style="list-style-type: tibetan; column-count: 2;"></code>によって、チベット文字の数字を設定している。各リスト項目を記載する<code>li</code>タグには何のプロパティも指定していない。 | ||
<div lang="sa-Tibt"> | <div lang="sa-Tibt"> | ||
739行目: | 739行目: | ||
<li>ཨཱི་དཱུ་ཏཽ་ཙ་སཔྟམྱརྠེ།</li> | <li>ཨཱི་དཱུ་ཏཽ་ཙ་སཔྟམྱརྠེ།</li> | ||
<li>དཱ་དྷཱ་གྷྭ་དཱཔ།</li> | <li>དཱ་དྷཱ་གྷྭ་དཱཔ།</li> | ||
</ol> | |||
</div> | |||
[https://developer.mozilla.org/ja/docs/Web/CSS/list-style-type list-style-type]のページに存在しない数字などについては、自分で番号を書く必要がある。 | |||
以下の例では、バイクシュキー文字の数字をリスト番号とするために、<code>ol</code>タグには<code>style="list-style-type: none; column-count: 2;"</code>を設定し、デフォルトで表示される番号を非表示にしている。 | |||
更に各<code>li</code>タグは<code><li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱚.</span>𑰪𑰴𑰟𑰿𑰠𑰰𑰨𑰯𑰟𑰹𑰓𑰿𑱁</li></code>のように記載している。 | |||
<code>user-select</code>は2024年8月4日現在Safariに対応していないため、ベンダープレフィックスも指定している。 | |||
<div lang="sa-Bhks"> | |||
𑰀𑰬𑰿𑰘𑰯𑰠𑰿𑰧𑰯𑰧𑰱 | |||
𑰀𑰞𑱃𑰢𑰿𑰨𑰝𑰦𑰺𑱀𑰠𑰿𑰧𑰯𑰧𑰾𑱁 𑰢𑰿𑰨𑰝𑰦𑰾𑱃𑰢𑰯𑰟𑰾𑱁 | |||
<ol style="list-style-type: none; column-count: 2;"> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱚.</span>𑰪𑰴𑰟𑰿𑰠𑰰𑰨𑰯𑰟𑰹𑰓𑰿𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱛.</span>𑰀𑰟𑰸𑰒𑰿𑱃𑰐𑰲𑰜𑰾𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱜.</span>𑰂𑰎𑰺𑱃𑰐𑰲𑰜𑰪𑰴𑰟𑰿𑰠𑰱𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱝.</span>𑰡𑱃𑰠𑰯𑰝𑰲𑰩𑰺𑰢𑱃𑰁𑰨𑰿𑰠𑰠𑰯𑰝𑰲𑰎𑰸𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱞.</span>𑰎𑰿𑰒𑰰𑰝𑰰𑱃𑰓𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱟.</span>𑰟𑰱𑰠𑰱𑰪𑰸𑰪𑰱𑰘𑰯𑰦𑰿𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱠.</span>𑰮𑰩𑰺𑱀𑰡𑰡𑰿𑰝𑰨𑰯𑰾𑱃𑰭𑰽𑰧𑰺𑰐𑰾𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱡.</span>𑰦𑰲𑰏𑰡𑰯𑰭𑰰𑰎𑰯𑰪𑰓𑰡𑰺𑱀𑰡𑰲𑰡𑰯𑰭𑰰𑰎𑰾𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱢.</span>𑰝𑰲𑰩𑰿𑰧𑰯𑰭𑰿𑰧𑰢𑰿𑰨𑰧𑰝𑰿𑰡𑰽𑱃𑰭𑰪𑰨𑰿𑰜𑰦𑰿𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣.</span>𑰡𑰯𑰕𑰿𑰖𑰩𑰻𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱚.</span>𑰃𑰟𑰳𑰟𑰸𑰟𑰿𑰟𑰿𑰪𑰰𑰪𑰓𑰡𑰽𑱃𑰢𑰿𑰨𑰐𑰴𑰮𑰿𑰧𑰦𑰿𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱛.</span>𑰀𑰟𑰭𑰺𑱃𑰦𑰯𑰝𑰿𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱜.</span>𑰫𑰸𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱝.</span>𑰡𑰰𑰢𑰯𑰝𑱃𑰊𑰎𑰯𑰕𑰡𑰯𑰒𑰿𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱞.</span>𑰌𑰝𑰿𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱟.</span>𑰭𑰦𑰿𑰤𑰲𑰟𑰿𑰠𑰻𑱃𑰫𑰯𑰎𑰩𑰿𑰧𑰭𑰿𑰧𑰸𑰝𑰯𑰪𑰡𑰯𑰨𑰿𑰬𑰸𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱠.</span>𑰄𑰗𑰾𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱡.</span>𑰅𑰼𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱣𑱢.</span>𑰃𑰟𑰳𑰝𑰻𑱃𑰓𑱃𑰭𑰢𑰿𑰝𑰦𑰿𑰧𑰨𑰿𑰞𑰸𑱁</li> | |||
<li style="position: relative;"><span style="position: absolute; right: 100%; margin-right: 0.55em; user-select: none; -webkit-user-select: none;">𑱤.</span>𑰅𑰼𑱁</li> | |||
</ol> | </ol> | ||
</div> | </div> |