• ベストアンサー

番号付きリスト(<Ol><Li>・・・</Ol>)の数字を全角に。

番号付きリスト(<Ol><Li>・・・</Ol>)の数字を全角に。 お世話になっております。 番号付きリスト(<Ol><Li>・・・</Ol>)の数字を全角にしたいのですが、 そのようなことはできるのでしょうか。 ご教授ください。よろしくお願いします。

  • HTML
  • 回答数2
  • ありがとう数5

質問者が選んだベストアンサー

  • ベストアンサー
  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.2

HTML5は<li>にvalue属性が持たせれる http://dev.w3.org/html5/spec/grouping-content.html#the-li-element 解釈間違ってるか? そこで、ついでにSelectorAPIも使ってjavascriptで <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>test</title> <style type="text/css"></style> </head> <body> <ol class="Z_ol"> <li value="1">aaaa<ol><li>xxx</li><li>yyyy</li></ol></li> <li value="2">bbbb</li> <li value="3">cccc</li> <li value="4">dddd</li> </ol> <script type="text/javascript"> var Z=["0","1","2","3","4","5"]; var Z_li=document.querySelectorAll(".Z_ol > li"); for (var i=0;i<Z_li.length;i++){ Z_li[i].style.listStyleType = "none"; Z_li[i].insertBefore(document.createTextNode(Z[Z_li[i].value]+"."),Z_li[i].firstChild); Z_li[i].normalize(); } </script> </body> </html>

asakichi00
質問者

お礼

できた! すごい! ありがとうございます。 勉強になりました。 感謝、感謝です。

その他の回答 (1)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

CSSだと漢数字は可能みたいですね。ただし、対応しているブラウザは必ずしも多くはないようです。  http://w3g.jp/css/list/list-style-type 当面はシステム的に付番するのはあきらめて、マニュアルで番号を振っていくのが確実では? あるいは、スクリプトで付番してゆくとか…

asakichi00
質問者

お礼

早速のご回答、誠にありがとうございます。 >マニュアルで番号を振っていくのが確実では? 承知しました。 全角数字を使う場合は、そのようにしたします。 ご助言ありがとうございました。

関連するQ&A

  • olのタグの入れ子で、1-1等の番号を振りたいが

    お世話になります。 olを使用したリストの入れ子で、1-1、1-2などの番号を 振る方法はないでしょうか。 例で言いますと、 <ol> <li>A <ol> <li>AA</li> <li>AB</li> </ol> </li> </ol> …等とすると、 1.A 1-1.AA 1-2.AB のように表示させたいのですが、このように、 入れ子の数に対して、「1-3-1」とか『2-A-1-1』などの 番号を振る方法とは、ありますでしょうか。 もしあるのであればご教授ください。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • ol要素の番号とリスト項目の離れについて

    最近HPを作り始めた素人です。 DWでol要素を使って順序つきの項目リストを作っております。 DWのデザインウィンドウとIEだとちゃんとリスト項目の行頭に番号が表示されるのですが、Google Chromeで閲覧すると番号とリスト項目が離れて表示されてしまいます。 (番号は左寄り、項目は中央です。) 例 <ol> <li>アメリカ</li> <li>フランス</li> <li>イギリス</li> </ol> IE        1. アメリカ        2. フランス        3. イギリス Chrome 1.                            アメリカ 2.                            フランス 3.                            イギリス 因みにこのol要素をdiv idで囲んでいてText-alignをcenterにしております。 単純な間違いだとは思うのですが、知識不足のため分かりません。 恐れ入りますが、どなたかご教授お願いいたします。                      

  • olタグ・liタグで一部のリストを横並びにした

    olタグ・liタグで一部のリストを横並びにしたい場合 olタグに display: inline; list-style-type: none; としても意味がないのでしょうか? <style type="text/css"> ol.test1{ display: inline; list-style-type: none; }</style> <ol class="test1"> <li><a href="#">階層1</a></li> <li><a href="#">階層2</a></li> <li><a href="#">階層3</a></li> </ol> としても横にはならずに番号が消えました。 なので li.test2{ display: inline; list-style-type: none; } として <ol> <li class="test2"><a href="#">階層1</a></li> <li class="test2"><a href="#">階層2</a></li> <li class="test2"><a href="#">階層3</a></li> </ol> としたのですが liの数だけスタイルシートを指定しないとダメなのでしょうか? <ol> <li class="test2"><a href="#">階層1</a></li> <li><a href="#">階層2</a></li> <li><a href="#">階層3</a></li> </ol> のように一つだけクラスに入れたら そこだけ番号が消えた上 横並びにはなりませんでした。

    • ベストアンサー
    • CSS
  • <ol><li>で表示されるリスト番号を、リンクに含めたい

    htmlで、<li>タグで表示される 1.リスト一 2.リスト二 などの数字(「1.」などの部分)がリンクに含まれないのですが、これにリンクをはる事は可能でしょうか? -1-2-3-4-5-6-7-8-9-・・・・・ といったような、連番の数字によるリンクをつくりたいのです。 javascriptなどに詳しくないのですが、もしそちらでも似たようなことができればお教えください。

  • リストの数字のフォントサイズを変えたい

    リストを使ったときに頭につく数字のフォントサイズを小さくすることは できるのでしょうか? 文章のフォントは<li>の後にフォントタグをつければ小さくなるのですが リストの数字が小さく出来ません。 これを小さくすることは可能でしょうか? <ol> <li> <li> </ol>

    • ベストアンサー
    • HTML
  • <ol><li></li></ol>タグでネスト

    <ol><li></li></ol>タグで ネストするにはどうすればいいでしょうか? <ol><li></li></ol>の中に<ol><li></li></ol>を入れたいです。 例えば ------------------------------------- 1大分類 1-1 その1 1-2 その2 2大分類 2-1 その1 2-2 その2 ------------------------------------- のようなことがしたいです。

    • ベストアンサー
    • HTML
  • <ol><li> 左側にスペースができてしまう

    <ol> <li> タグを使うと、左側にスペースができてしまう。 <ol> <li>aaa</li> <li>bbb</li> <li>ccc</li> </ol> をすると、番号の左に若干スペースができてしまいます。 このスペースを作らないようにするにはどうすればいいでしょうか?

  • テーブルタグの中に<ol><li>を入れても正常に数字が表示されません。

    テーブルタグの中に<ol><li>を入れても正常に数字が表示されません。 例えばテーブルの外に<ol>を入れて中に<li>を入れても表示される数字が 全部1になってしまいます。またテーブルの中に<ol>を入れても同じようになってしまいます。どなたか解決法をご存知の方がいらっしゃりましたら、 アドバイスお願いいたします。

    • ベストアンサー
    • HTML
  • <OL><LI>タグにて、こういう風にはできないのでしょうか???

    こんにちは(*- -)(* _ _) たびたびお世話になっています。 今、HTMLを作成中なのですが、 番号を振るタグで<OL><LI>がありますよね? あれだと、 1. ●● 2. ●● という風に出るのですが、 1. ●●  1-1. ××  1-2. ××       ×××  1-3. ××× このように、1-1.みたいにはできないでしょうか・・・(T-T) ムリっぽいなぁ・。・。・とは思うものの。。。 もし、「そのタグではムリなのでこうしてみたら?」というのがあれば是非教えてください!!!!

    • ベストアンサー
    • HTML
  • <li>(リスト)で、数字や記号に色を付ける方法

    HTMLタグで リスト(<li>)というのがありますが、 これを使った場合で、文字ではなくその文字列の前に付く リストの記号やリスト番号に色を付ける方法はありませんか。 1.ABC 2.DEF 3.GHI の数字の部分に色を付けたいのですが。 単純には出来ないのでしょうか?

    • ベストアンサー
    • HTML

専門家に質問してみよう