Quantcast
Channel: 円周率近似値の日に生まれて理系じゃないわけないだろ! - knifeのblog
Viewing all articles
Browse latest Browse all 5376

アメブロでのHTMLの番号付きリストのタグでtypeを設定したのに…

$
0
0

不思議なことが起こりました。
昨日の記事で、リスト表示で、

<ol type="a">
<li>りんご</li>
<li>ゴリラ</li>
<li>ラッパ</li>
</ol>

みたいな、HTMLを記述したんですけど、
通常表示では、

  1. りんご
  2. ゴリラ
  3. ラッパ

のように、記述通りの解釈になっていたんだけど、いざ記事を確認してみると、

  1. りんご
  2. ゴリラ
  3. ラッパ

のようになってしまっていた。
因みにプレビューでも1. 2. 3.でした。

つまり、通常表示と実際の記事での見え方に食い違いが起きてしまっていたんです。
後から気がついたので、styleタグで修正しました。

<ol style="list-style-type: lower-alpha">
<li>りんご</li>
<li>ゴリラ</li>
<li>ラッパ</li>
</ol>

type属性では、記事に反映されないというアメブロの仕様なのかな。
というわけで、番号付きリストのスタイルシートを紹介します。

【大文字のローマ数字】
list-style-type: upper-roman;

  1. りんご
  2. ゴリラ
  3. ラッパ


【小文字のローマ数字】
list-style-type: upper-roman;

  1. りんご
  2. ゴリラ
  3. ラッパ


【漢数字】
list-style-type: cjk-ideographic;

  1. りんご
  2. ゴリラ
  3. ラッパ


【丸数字】※Firefox系のみサポートのようです。
list-style-type: circled-decimal;

  1. りんご
  2. ゴリラ
  3. ラッパ


【小文字のギリシャ文字】※大文字はC3から外れたようです。
list-style-type: lower-greek;

  1. りんご
  2. ゴリラ
  3. ラッパ


【大文字のアルファベット】
list-style-type: upper-alpha;

  1. りんご
  2. ゴリラ
  3. ラッパ


【小文字のアルファベット】
list-style-type: lower-alpha;

  1. りんご
  2. ゴリラ
  3. ラッパ


【ひらがなのあいうえお順】
list-style-type: hiragana;

  1. りんご
  2. ゴリラ
  3. ラッパ


【カタカナのアイウエオ順】
list-style-type: katakana;

  1. りんご
  2. ゴリラ
  3. ラッパ


【ひらがなのいろは順】
list-style-type: hiragana-iroha;

  1. りんご
  2. ゴリラ
  3. ラッパ


【カタカナのイロハ順】
list-style-type: katakana-iroha;

  1. りんご
  2. ゴリラ
  3. ラッパ


【干支】
list-style-type: cjk-earthly-branch;

  1. りんご
  2. ゴリラ
  3. ラッパ


【十干】
list-style-type: cjk-heavenly-stem;

  1. りんご
  2. ゴリラ
  3. ラッパ


【日本の大字(だいじ)壱弐参】※Firefox系のみサポートのようです。
list-style-type: japanese-formal;

  1. りんご
  2. ゴリラ
  3. ラッパ


【繁体字】※これが出るなら、なんで大字はダメなんだろう
list-style-type: trad-chinese-formal;

  1. りんご
  2. ゴリラ
  3. ラッパ


@counter-styleを使って、独自の番号付きリストを作ることが出来るようだが、Firefox系しかサポートしていない模様。

【日本の大字(だいじ) @counter-styleバージョン】

  1. りんご
  2. ゴリラ
  3. ラッパ

Firefox系で編集してる状態の通常表示では表示されるが、プレビューや実際の記事には表示されません。
結局そこの問題になるのか。


他にも沢山あるけど、このくらいで勘弁してねw


ではでは


Viewing all articles
Browse latest Browse all 5376

Trending Articles