- ベストアンサー
ＨＴＭＬのテーブルで桁をそろえる方法
ＨＴＭＬのテーブルで、桁をそろえる方法を教えてください。 例） 100 100.5 100.555 10000 をセンタリングすると 100 100.5 100.555 10000 のようになり、とてもみにくくなります。 100 100.5 100.555 10000 のように見やすくしたいのですが、ＨＴＭＬをどのようにすればいいでしょうか？
- HTML
- 回答数4
- ありがとう数4
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
#3さんから正しい方法が提示されていますがやはり実装が追いついていないので自分なら#1さんの回答にもちょっとあったスペース( )を使った方法で揃えるかな。 微妙な位置ずれはフォントの問題から生じるので等幅フォントを指定します。（これで絶対大丈夫というわけではありませんが。） <html> <head> <title>桁合わせの例</title> <style type="text/css"> <!-- td{ border:solid 1px #ccc; text-align:right; font-family:monospace; } --> </style> </head> <body> <table> <tr><td>100 </td></tr> <tr><td>100.5 </td></tr> <tr><td>100.555</td></tr> <tr><td>10000 </td></tr> </body> </html>
その他の回答 (3)
- UKY
- ベストアンサー率50% (604/1207)
col 要素の align 属性を char に設定するのが HTML のテーブルで桁をそろえる正しい方法です。char 属性で揃える文字 (この場合は小数点) を指定します。 4 行 1 列のテーブルの例 <table> <col align="char" char="."> <tr> <td>100</td> </tr> <tr> <td>100.5</td> </tr> <tr> <td>100.555</td> </tr> <tr> <td>10000</td> </tr> </table> ただし、ブラウザによってはうまく揃わないことがあります。
お礼
URLも見たのですが、ちょっと分かりにくいです。 すいません。
- moon_night
- ベストアンサー率32% (598/1831)
透明なＴＡＢＬＥの方法を。 <table> <tr><td align="right">100</td><td>.</td><td></td></tr> <tr><td align="right">100</td><td>.</td><td>5</td></tr> <tr><td align="right">100</td><td>.</td><td>555</td></tr> <tr><td align="right">10000</td><td></td><td></td></tr> </table>
お礼
この方法もありますね。 しかし、テーブルに線をつけれませんね。
- saintandre
- ベストアンサー率31% (194/607)
透明なテーブルを組んだりスタイルシートを使ったりいろいろな手がありますが とりあえず一番単純な方法を挙げておきます。 <font color="#ffffff">00</font>100 <font color="#ffffff">00</font>100.5 <font color="#ffffff">00</font>100.555 10000 ようするに空けたい部分を「0」で埋めてさらにその余計な部分を背景色と同じにして隠す方法です。 範囲選択されると隠してくる部分がでてきてしまうのが難点ですが。 「 」でスペースを挿入する手もありますが試してみたところ微妙にずれますね。
お礼
その手がありましたか！ 頭を柔軟にしなければいけませんね。 ありがとうございました。
お礼
この方法がベストだと思います。 背景の色を変えても問題ありません。 ありがとうございました！