- ベストアンサー
ＴＤタグ内での均等割付の仕方
Ｗｅｂページにテーブルを作成し、そのデータを均等割付したいんです。 均等割付はスタイルシートで、text-alignの値をjustifyにすればいいのはわかったんですが、それをどう書けばいいのかがわからないんです。 お知恵を貸して下さい。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
私も完全に理解できているわけではないので文章で説明しづらいのですが、サンプルコードを貼り付けてお茶を濁しておきます。 折り返しがあるかどうかで効果に違いがあるかと思います。さらに日本語の場合はtext-justifyを指定しないとtext-align:justify指定が効かないため、ie5以降以外では使えません。 ------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-2022-JP"> <TITLE>text-align:justifyとtext-justifyの組み合わせの確認(lintチェックしちゃイヤよ)</TITLE> <META HTTP-EQUIV="CONTENT-STYLE-TYPE" CONTENT="text/css"> <STYLE type="text/css"> <!-- th,td {font-size:14px; width:150px;} .css0 {} .css1 {text-align:justify;} /* 規定値(text-justify:auto;) */ /* 以下、ie5以降のみ */ .css2 {text-align:justify; text-justify:newspaper;} /* 英文向け */ .css3 {text-align:justify; text-justify:inter-word;} /* 単語間のみによる調整 */ .css4 {text-align:justify; text-justify:distribute-all-lines;} /* 最後の行も調整 */ .css5 {text-align:justify; text-justify:inter-ideograph;} /* 単語間と文字間による調整 */ .css6 {text-align:justify; text-justify:inter-cluster;} /* アジア言語向け */ .css7 {text-align:justify; text-justify:distribute;} /* タイ言語向け */ .css8 {text-align:justify; text-justify:kashida;} /* アラビア語向け */ --> </STYLE> </HEAD> <BODY> text-align:justifyとtext-justifyの組み合わせの確認 <table border=1> <tr> <th>英字</th> <th>日本語<br>(折り返しあり)</th> <th>日本語<br>(折り返しなし)</th> </tr> <script type="text/javascript"> <!-- for (css=0; css<9; css++) { document.write("<tr><td valign=\"top\" class=\"css" + css + "\">"); document.write("Big Fat Cats, you make the rockin' world go round. "); document.write("Big Fat Cats, you make the rockin' world go round.<br><br>"); document.write("Big Fat Cats,<br>you make the rockin' world go round.<br>Yeah"); document.write("</td><td valign=\"top\" class=\"css" + css + "\">"); document.write("いろはにほへと<br>ちり ぬる を<br>．．．<br>あさきゆめみしゑひもせすん"); document.write("</td><td valign=\"top\" class=\"css" + css + "\">"); document.write("いろはにほへと<br>ちり ぬる を<br>．．．<br>あさきゆめみし<br>ゑひもせすん"); document.write("</td></tr>"); } //--> </script> </table> </BODY> </HTML> ------------------- 詳しくは参考URLの解説をご覧下さい。 http://tohoho.wakusei.ne.jp/css/reference.htm#text-align http://tohoho.wakusei.ne.jp/css/reference.htm#text-justify http://www.zspc.com/documents/css2/text/textalign.html
その他の回答 (1)
- mrumesuke
- ベストアンサー率45% (254/557)
<td style="text-align:justify; width:100px"> Big Fat Cats, you make the rockin' world go round. </td> width指定をお忘れなく。
補足
回答ありがとうございます。 試してみましたが、できませんでした。 <head></head>内に何か書き込む必要があったんでしょうか？
お礼
こんなに丁寧な回答ありがとうございます。 javascriptってのが見えるので、抵抗を感じますが、これで上手くいかないか試してみます。 ほんとうにありがとうございます。