HTMLで文字を中央に寄せる
- HTMLタグを使って文字を中央に寄せようとしたがうまくいかない。スタイルシートを使用しても同じ結果になる。
- ブラウザはIEのバージョン6を使用している。
- HTMLタグを使用すれば文字が中央に寄せられるが、スタイルシートではうまくいかない。
- ベストアンサー
文字を中央に寄せる
<HTML> <HEAD> <TITLE>メンバー表</TITLE> <STYLE TYPE="text/css"> <!-- TR｛text-align:center;｝ TH｛text-align:center;｝ TD｛text-align:center;｝ --> </STYLE> </HEAD> <BODY> <TABLE BORDER=1 ALIGN=CENTER> <TR><TH ROWSPAN=3>ここには画像</TH><TH>名前</TH><TH>称号</TH><TH>レベル</TH><TH>タイプ</TH><TH>AC</TH></TR> <TR><TD>竜千士 翔</TD><TD>見習い魔導士</TD><TD>45</TD><TD>con18,wis18</TD><TD>43</TD></TR> <TR><TD>コメント</TD><TD COLSPAN=4>v(￣Д￣)v イエーイ </TD></TR> </TABLE> </BODY> 上記のようにスタイルシートで文字を中央に寄せようとしたのですがどうしてもできません。 htmlタグでやるとできたのですが・・・ どこが間違っているのかどうかご教授お願いいたいします。 ちなみに使っているブラウザはIEでバージョンは６ です
- ryuusennsisho
- お礼率63% (187/295)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
もし、上記のソースが完全にコピー&ペーストだとしたら、スタイルシート指定の括弧が全角になっているせいで認識されていないものと思われます。 TH｛text-align:center;｝ TD｛text-align:center;｝ これを TH {text-align:center;} TD {text-align:center;} に直してみてください。 あと、TRへのスタイル指定は無駄だと思います。 見当違いでしたらごめんなさい。
関連するQ&A
- CSSのtableについて【CSSが無かったのでHTMLで…。】
<html> <head> <title>test</title> <style type="text/css"> <!-- table { border : 1px #000000 solid; text-align : center; } td,th { border : 1px #000000 solid; width : 100px; } --> </style> </head> <body> <table> <tr> <td rowspan="2"> 1 </td> <td> 3 </td> </tr> <tr> <td> 2 </td> </tr> <tr> <td colspan="2"> 3 </td> </tr> </table> </body> </html> このように入力をした場合、一番下にできるテーブル(3)2つ結合しているにもかかわらず、1つ分？の状態で文字がcenterになってしまいます。結合した(2つの)真ん中に表示させるにはどうしたらいいですか？？ 教えてください☆
- ベストアンサー
- HTML
- スタイルシートでの中央揃え
<html> <head> <title>文書のタイトル</title> <meta http-equiv="Content-Style-Type" content="text/css"> <style> body{text-align: center;} </style> </head> <body> <table> <tr> <td> テーブルの内容 </td> </tr> <table> テーブル外の内容 </body> </html> のように、スタイルシートで、 body{text-align: center;} を指定したのですが、IE6ではtableが中央揃えされましたが、NN7.1やFirefox 1.5.0.7ではtableが中央揃えされませんでした。 centerタグを使えば問題ありませんでしたが、非推奨なのであまり使いたくありません。 スタイルシートを用いてIE6と同様にNNやFirefoxでtableを中央揃えするようにするにはどうすればいいでしょうか。
- ベストアンサー
- HTML
- 一気に「テーブルの2列目のtdタグを右詰にする
<html> <head> <title>test</title> </head> <body> <table border=1> <tr><th>No</th><th>aaaaaaa</th></tr> <tr><td>1</td><td>bbb</td></tr> <tr><td>2</td><td>ccc</td></tr> </table> </body> </html> このようなテーブルで 右側の2列目のtdタグを右詰にしたいのですが、 一気に「テーブルの2列目のtdタグを右詰にする」と言う方法は有りますか? 今は <html> <head> <title>test</title> <style type="text/css"> td.example1 { text-align: right; } </style> </head> <body> <table border=1> <tr><th>No</th><th>aaaaaaa</th></tr> <tr><td>1</td><td class="example1">bbb</td></tr> <tr><td>2</td><td class="example1">ccc</td></tr> </table> </body> </html> このようにしていますが 一つ一つタグを付けるのは非効率的と思っています。
- ベストアンサー
- HTML
- tableセルに色を付ける
tableセルに色を付けます。 で、行で指定しようとtrタグにbgcolorをいれました。 ネスケでは問題ないのですが、ie6だとテーブルの外にも色がついてしまい変です。 セルを結合させたりしたりしてることが影響あるのでしょうか？ieのバグですかね？ コレを解決するには、trで色を付けるのを諦めて、セルごと（tdやth）に指定していくしかないのでしょうか。 スタイルシートは使わない前提です。htmlだけでの解決があったら教えてください。 <html> <head> </head> <body> <table border="10" align="center"> <tr> <th colspan="2">タイトル</th> </tr> <tr> <td height="70" rowspan="2" align="center" valign="top">１</td> <td>あ</td> </tr> <tr> <td>い</td> </tr> <tr bgcolor="red"> <td>２</td> <td>う</td> </tr> </table> </body> </html>
- ベストアンサー
- HTML
- テーブルの中央配置
内容を中央揃えにしたく、以下のようにCSSで記述してみたのですが、テーブルが揃いません。どうすればよいのでしょうか？ <head> <style type="text/css" media="screen"><!-- body { background-color: #cecece; text-align: center; } --></style> </head> <html> <body> aaa <table width="64" border="1" cellspacing="2" cellpadding="0"> <tr> <td>bbb</td> </tr> </table> </body> </html>
- ベストアンサー
- HTML
- 表と画面の余白について
ホームページ作成初心者です。 Yahoo!のフリースペースGeoCitesで、アドバンストHTMLエディタで直接タグを打って作成していますが、表の行を追加すると、追加した行の幅だけ上部に余白ができてしまい、画面の下半分に表が表示されます。 余白はタイトルと表の間にできますが、タイトルを削除したり表の下に移動させても上面の余白は変わりません。不要な余白をなくす方法を教えて下さい。 ソースは以下の通りで、△△△の項目の<tr></tr>は２０位あります。 <html> <head> <title>◯◯◯</title> </head> <!--color--> <body bgcolor="#ddfff" text="#000000" link="#0000ff" vlink="#ff0000"> <center> <!--HEAD1--> <h1>タイトル</h1> <table border="1" cellpadding="3" width="700" cellspacing=1 bordercolor="#dddddd"> <tr bgcolor="#ccfff"> <th>◯◯◯</th> <th>◯◯◯</th> <th>◯◯◯</th> <th>◯◯◯</th> </tr> <tr> <td align="center">△△△</td> <td align="center">△△△</td> <td align="center">△△△</td> <td align="center">△△△</td> </tr> </table> </body> </html>
- 締切済み
- HTML
- cssでテーブルの位置を設定するには？
<table border="1" align="left">でテーブルの位置を競ってすることはできたのですが スタイルシートで行いたいです。 そもそも他のテーブルはすべて中央に寄せたいため、 table { margin-left: auto; margin-right: auto; } としています。 そのうえで、任意のテーブルのみ左に寄せて表示したいので table.test { align:left; } としたのですが、うまくいきません。 ---------------------------------------------------------- <html> <head> <title>test</title> <STYLE type="text/css"> table { margin-left: auto; margin-right: auto; width: 40%; } table.test { width: 80%; align:left; } </STYLE> </head> <body> <table border="1"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> <br><br><br> <table border="1" align="left"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> <br><br><br> <table border="1" class="test"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> </body> </html> ----------------------------------------------------- このコードだと、 table.test { width: 80%; align:left; } の、 width: 80%; の部分は認識されるようですが、align:left;は無視されます。 スタイルシートでテーブルの位置を設定する方法をご教授ください。
- 締切済み
- CSS
- 文字を右寄りにしつつ、背景を赤にするには
css初心者です。 一番左のセルのみ、文字を右寄りにしつつ、背景を赤にしたいのですが、 全ての背景に色がついてしまいます。 １と１００のセルのみ、文字を右寄りにしつつ、背景を赤にするにはどうすればいいですか？ <html> <head> <title>test</title> <style type="text/css"> td.table_moji_right { text-align: right; } td { background-color: red; } </style> </head> <body> <table border=1 cellspacing=1> <tr><td class="table_moji_right">1</td><td>aaa</td></tr> <tr><td class="table_moji_right">100</td><td>iii</td></tr> </table> </body> </html>
- ベストアンサー
- HTML
- コンテナ内で文字を中央に表示したい
<div> <table border=0 cellspacing=0 cellpadding=0 style="width: 100%; height: 100%;"> <tr> <td style="text-align: center; vertical-align: middle;"> Hello! </td> </tr> </table> </div> のように、テーブルを使わずに（できればCSSなどで）divタグ内のテキストを中央に表示したいのですが、できますか？ よろしくお願いします。
- ベストアンサー
- HTML
- テーブルの幅 余白をなくすことは可能ですか？
<html> <head> <title>test</title> </head> <style type="text/css"> table { width: 100%; } </style> <body> <table border=1> <tr><th>a</th><th>b</th></tr> <tr><td>1</td><td>2</td></tr> </table> </body> </html> のように テーブルの幅を１００％にしても 両端に余白が出来てしまいますが この余白をなくすことは可能ですか？ 添付画像はIEで表示させた状態ですが ファイアフォックスなど他のブラウザで表示させても余白が出来ます。
- ベストアンサー
- HTML
お礼
ご回答ありがとうございます！ ご指摘の通りでした。 ずっと悩んでいたので感謝感謝です あとTRは無駄でした(^^ゞ 本当にありがとうございました。