- ベストアンサー
文章の見栄え
テーブルタグの下に文章を入れているのですが、中央に揃えると文章の最後の文字数が少ない為、その文字も真ん中に揃ってしまい見栄えが悪いです…テーブルの幅に合わせ、文字の頭は左揃えにしたいのですが、 テーブルタグを <CENTER> <TABLE width="600"> <TBODY> <TR> <Div align="center"><Table border="1" width="600" height="10" bgcolor="#ffbfff" bordercolor="#0080ff" cellspacing="0"> <Tr><Td align="left"> タイトル </Td></Tr></Table> <BR> <font size="-1"> ここに文章を入れています。<BR> 文章は２段です。</font> </Div> </TR> </TBODY> </TABLE> </CENTER> このようにしても意味はないのでしょうか？
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
文章を左揃えにしたいのに、中央寄せになるのを修正したいということでしょうか？ だとすれば、</Div>の位置を左揃えにしたい文章よりも前に移動すればいいだけかと思います。 あと、<Div align="center">の前に<TD>が抜けているのと、文章の後の</TR>の前に</TD>が抜けていますので、これらも追加したほうがいいと思いますよ。 <CENTER> <TABLE width="600"> <TBODY> <TR> <TD> <Div align="center"> <Table border="1" width="600" height="10" bgcolor="#ffbfff" bordercolor="#0080ff" cellspacing="0"> <Tr><Td align="left"> タイトル </Td></Tr></Table> </Div> <BR> <font size="-1"> ここに文章を入れています。<BR> 文章は２段です。</font> </TD> </TR> </TBODY> </TABLE> </CENTER>
その他の回答 (3)
> <center>このタグを使っている所は直した方がいいのですね… > width: 600は必要なタグですか？ 書式や表現はスタイル設定で行うべき というのが ＳＥＯ(サーチエンジン の最適化)の上で 重要な意味を持ちます。その辺を気にしないなら ブラウ ザごとの表示のズレにだけ気をつけてればいいと思います。 「width:600」は タグではなく これもスタイル設定です。<div>の中身が 中央揃えにならないように設定する為には <div>に 幅とマージンの設定を 入れないといけません。抜いてみれば分かりますが 中身まで中央揃えにな ってしまうはずです。 あとスタイル設定は 本来 <body>内ではなく <head>内か 外部リンクにし た方がいいとされています。これもＳＥＯを気にしないなら それほど問題 ないと思います。
> テーブルなどを使わない長い文章を＜center＞で作る時に余りの文字 > までも真ん中になってしまうのを避けるには＜/Div＞で閉じればキレ > イに表示されるのですか？ そんなことはないです。<div>は あまり特別な意味のないブロック要素 という意味合いでしかないので。 ブロックレベル要素をセンタリングする方法 - Web標準普及プロジェクト http://www.mozilla.gr.jp/standards/webtips0004.html が参考になると思います。本来 <div>や <table>のようなブロック要素 にはには text-alignを設定しないのが前提な訳です。 それを無理やりやろうとすると IEのバグにも対応させる必要があり 幅と 左右のマージンを指定しなければなりません。 <center> <div style="width: 600; text-align: left; margin: 0 auto;"> あいうえお<br />かきく</div> </center> あと一応 読んでおいて欲しいのですが 右・左・中央寄せ http://uguisu.skr.jp/html/center.html 現在 <center>は推奨されていませんので。極力 スタイル設定で指定 するようにして下さい。
補足
<center>←このタグは… <div style="width: 600; text-align: left; margin: 0 auto;"> あいうえお<br />かきく</div> </center> <center>このタグを使っている所は直した方がいいのですね… width: 600は必要なタグですか？
tableタグは レイアウト用ではなく あくまで表を作る時のものなので 本来のレイアウトは <head></head>内に <style type="text/css"><!-- body { text-align: center; } #titleFrame { width: 600; text-align: justify; margin: 0 auto; } h1 { margin: 0; padding: 1pt; background-color: #ffbfff; font-weight: normal; font-size: medium; border: 2px #0080ff solid; } h2 { margin: 0; font-weight: normal; font-size: x-small; } --></style> と記述しておいて 本文は <div id="titleFrame"> <h1>タイトル</h1> <h2>ここに文章をいれています<br /> 文章は２段です。</h2> </div> こう表現した方がいいかもしれません。
補足
Chiquilinさんの方法でやってみたら、とてもキレイに出来ました！！ ありがとうございます！！ テーブルなどを使わない長い文章を＜center＞で作る時に余りの文字までも真ん中になってしまうのを避けるには＜/Div＞で閉じればキレイに表示されるのですか？ なかなか、いつもキレイに出来ずそれで悩んでいます…
お礼
まだまだ勉強不足ですね… 携帯サイトを作るよりも奥が深いですね。 丁寧な回答ありがとうございました！！