- ベストアンサー
不要な余白を削除する方法を教えてください。
超初心者です。企業のホームページ担当になってしまい、毎日頭から煙を出しながら仕事をしています。txtに下記のようなタグを打ち、ｕｐしてみたところ、表題<h1>～</h1>と表の間に変な余白ができてしまいました。どのようにすればこの余白が消えるのでしょう？ 全くの初心者が本を読み読み、またこちらでヒントを頂きながら仕事を進めていますが、度々壁にぶつかっています。 あまりにも初歩的な質問かもしれませんが、どうぞ教えてください。 よろしくお願いいたします。 <h1>○○リーグで活躍！応援に行こう</h1> <table border="1" width="600"><tr bgcolor="#eeeeee" height="0" height="0"> <th align="center">日 程</th> <th align="center">開始時刻</th> <th align="center">対戦相手</th> <th align="center">球 場</th> <th align="center">結 果</th> </tr> <tr> <td align="center">○月○日（○）</td> <td align="center">１３：００～</td> <td>○○株式会社</td> <td>△球場</td> <td>○○ 9 - 6 ■■</td> </tr> </table>
- ringo1111
- お礼率76% (36/47)
- HTML
- 回答数4
- ありがとう数4
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
＃３ naokitaです。 補足への回答ですが、もう解決しましたか？ 一応、再確認しましたが問題（隙間）無く表示されます。 ご利用は古いブラウザですか？ オペラ２とかネスケ４とか？ （＃３は環境的には約９９％のユーザーが表示可能です） コピー＆ペーストしてから再確認してみて下さい。 ちなみにＨＴＭＬだけで変更確認する場合は、 元の表記の下に記述し見比べると変更確認が確実です。 また、タグ手打ちでは無くコピペで写しましょう（ケアレスミスが無い） コピペミスもありますがｗ・・・ ＜head部DOCTYPE等抜きに 上が元のtable 下が改良後＞ ------------------------------------- <html> <body> <!--元の表示 ここから--> <h1>○○リーグで活躍！応援に行こう</h1> <table border="1" width="600"><tr bgcolor="#eeeeee" height="0" height="0"> <th align="center">日 程</th> <th align="center">開始時刻</th> <th align="center">対戦相手</th> <th align="center">球 場</th> <th align="center">結 果</th> </tr> <tr> <td align="center">○月○日（○）</td> <td align="center">１３：００～</td> <td>○○株式会社</td> <td>△球場</td> <td>○○ 9 - 6 ■■</td> </tr> </table> <!--改良後 ここから--> <h1 style="margin:0">○○リーグで活躍！応援に行こう</h1> <table border="1" width="600"><tr bgcolor="#eeeeee"> <th>日 程</th> <th>開始時刻</th> <th>対戦相手</th> <th>球 場</th> <th>結 果</th> </tr> <tr> <td align="center">○月○日（○）</td> <td align="center">１３：００～</td> <td>○○株式会社</td> <td>△球場</td> <td>○○ 9 - 6 ■■</td> </tr> </table> </body> </html> --------------------------------------- どんな環境下でＨＰ製作をしているのかわかりませんが Winならメモ帳に写し保存先を指定しファイル名をfoo.html等で、 ファイルの種類をすべてのファイルにし保存し保存先からＷクリック もしくは右クリック・プログラムから開く・ブラウザ選択して見て下さい。 （メモ帳を開く→コピペ→保存→確認 １分で出来ます） こちらも初心者の頃はミスばっかりでしたので頑張って下さい。
その他の回答 (3)
- naokita
- ベストアンサー率57% (1008/1745)
<h1 style="margin:0">でＯＫ １段目の<tr>でheight="0" がダブルで記述・・・（不要では？） <th>は元々センター配置です（align="center"も不要では？） ----------------------------------------------------- <h1 style="margin:0">○○リーグで活躍！応援に行こう</h1> <table border="1" width="600"><tr bgcolor="#eeeeee"> <th>日 程</th> <th>開始時刻</th> <th>対戦相手</th> <th>球 場</th> <th>結 果</th> </tr> <tr> <td align="center">○月○日（○）</td> <td align="center">１３：００～</td> <td>○○株式会社</td> <td>△球場</td> <td>○○ 9 - 6 ■■</td> </tr> </table>
補足
早速のご回答ありがとうございます。 教えていただいたやり方でやってみたのですが「ドド～ン」 と、余白が残っています。なぜでしょう？？ 本当に困ってしまいました。
<table border="1" width="600"> <caption>○○リーグで活躍！応援に行こう</caption> <tr bgcolor="#eeeeee" height="0" height="0"> <th align="center">日 程</th> <th align="center">開始時刻</th> <th align="center">対戦相手</th> <th align="center">球 場</th> <th align="center">結 果</th> </tr> <tr> <td align="center">○月○日（○）</td> <td align="center">１３：００～</td> <td>○○株式会社</td> <td>△球場</td> <td>○○ 9 - 6 ■■</td> </tr> </table>
お礼
早速のご回答ありがとうございました。 明日出社したらそのようにやってみます。 勉強になりました。
- miho5098
- ベストアンサー率22% (6/27)
本来ならば、スタイルシートというものを使ったほうが良いのですが、「超初心者です」との事でしたので・・・ <h1 style="margin:0px;padding:0px;">○○リーグで活躍！応援に行こう</h1> 上記のようにしてみてはいかがですか？ ホームページについて「とほほ」というサイトは勉強になりますよ^^
お礼
はじめまして！早速のご回答ありがとうございました。 明日、出社したらやってみます。 「とほほ」は分かりやすく説明してあるので、初心者の私には 大変ありがたいです。 ありがとうございました。
関連するQ&A
- 表と画面の余白について
ホームページ作成初心者です。 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
- 楽天ブログで表を書いたら上部の余白が消せません。
ホームページからコピーして文字位置を変えただけなのに、上部に余白が出来てしまい、消そうとしてｂｏｄｙタグを使ったら使用禁止で使えません。 どこが悪いのでしょうか？ ＜コピーして自分で書いたもの＞ <center> <table border=1> <tr> <th>●●●</th> <th>●●●</th> <th>●●●</th> <th>●●●</th> </tr> <tr> <td align=center>●●●</td> <td align=right>●●●</td> <td align=right>●●●</td> <td align=right>●●●</td> </tr> <tr> <td align=center>●●●</td> <td align=right>●●●</td> <td align=right>●●●</td> <td align=right>●●●</td> </tr> <tr> <td align=center>●●●</td> <td align=right>●●●</td> <td align=right>●●●</td> <td align=right>●●●</td> </tr> </table></center>
- 締切済み
- ブログ
- １ページにテーブルを複数設定・一括変更の方法について
一つのページに複数（十数個）を設置する場合 まとめて設置する方法はあるのでしょうか？ また、サイズ等を変更したい場合も 一括して変更する方法はあるのでしょうか？ 例えば、以下の物を数十個設置する場合 設置自体は簡単なのですが、変更が・・、 どうにか簡単にできる方法があればご教授下さい。 <center> <table border="0" width="600" cellspacing="1" bgcolor="#0fb1ff" height="200"> <tbody> <tr> <td colspan="2" width="600" bgcolor="#ffffff" height="20" align="center"></td> </tr> <tr> <td width="200" bgcolor="#ffffff" height="100" align="center"></td> <td width="400" bgcolor="#ffffff" height="100"></td> </tr> <tr> <td width="200" bgcolor="#ffffff" height="20" align="center"></td> <td width="400" bgcolor="#ffffff" height="20"></td> </tr> <tr> <td width="200" bgcolor="#ffffff" height="20" align="center"></td> <td width="400" bgcolor="#ffffff" height="20"></td> </tr> <tr> <td width="200" height="20" bgcolor="#ffffff" align="center"></td> <td width="400" height="20" bgcolor="#ffffff"></td> </tr> <tr> <td width="200" bgcolor="#ffffff" height="20" align="center"></td> <td width="400" bgcolor="#ffffff" height="20"></td> </tr> </tbody> </table> </center> 宜しくお願いします。
- ベストアンサー
- 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
- ネスケでの右余白
よろしくお願いします。 IEだと隙間なく表示されるのですが、ネスケだと右余白が空いてしまいます。 (デフォルトでスクロールバーの領域なのでしょうか…?) 隙間なく表示するようにするにはどうしたらよいでしょうか? <body style="margin:0" bgcolor="#000000" leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0"> <table width=100% cellpadding=0 cellspacing=0 border=0 height=100> <tr height=50> <td bgcolor=#ff6600> </td> </tr> <tr height=50> <td bgcolor=#00ccff> </td> </tr> </table> 以下内容－－－－
- 締切済み
- CSS
- 画面表示が100％になりません。
<table>でいろいろやっている内に、画面表示が100％にならず、周囲1％程度の余白ができてしまいました。 外部CSSを併用したためか、と思いはずしてみても変わりません。(cssでもそのような記述はしていません。）どこを修正すればよいのでしょうか？ どなたかご指導お願い致します。 <html> <head> <title>＊＊＊</title> <link href="css/css" rel="stylesheet" type="text/css"> </head> <body > <TABLE border="0" width="100%" height="100% " bgcolor="#000000"> <TBODY> <tr> <td align="center"> <TABLE border=2 width="480" height="480" bgcolor="#222222" bordercolor="#000000" > <TBODY> <tr> <td align="center"> 省略 </td> </tr> </TBODY> </TABLE> <p align="center"></P> </td> </tr> </TBODY> </TABLE> </body> </html>
- ベストアンサー
- HTML
- borderが1のテーブル
ボーダーが1ピクセルくらいの表を作りたいので、tableの入れ子で作ったのですが「tableの入れ子は良くない」ととあるサイトで読んだので、入れ子にしないでtableを作りたいのですが何か良い方法はありますでしょうか？ 私が書いたのはこんなかんじです。 <table width="400" border="0" cellpadding="0" cellspacing="0"> <tr> <td bgcolor="#000000"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="1"> <tr bgcolor="#999999"> <th><div align="center"><font size="2">名称</font></div></th> <th><div align="center"><font size="2">模型材質</font></div></th> <th><div align="center"><font size="2">生産材質</font></div></th> </tr> <tr bgcolor="#FFFFFF"> <td bgcolor="#999999"><div align="center"><font size="2">本体</font></div></td> <td><div align="center"><font size="2">発泡塩ビ板</font></div></td> <td><div align="center"><font size="2">プラスチック</font></div></td> </tr> </table></td> </tr> </table> CSSで「style="border-width :1px 1px 1px 1px;border-style : solid solid solid solid ;border-color :#000000 #000000 #000000 #000000 ;"」というのを入れてやってみたのですが、これだと外側にしかラインが表示されませんでした。 よろしくおねがいします。
- ベストアンサー
- その他（プログラミング・開発）
- Mac IEのバグなのでしょうか？
TMEspionです。 <table border="0" cellpadding="5" cellspacing="5"><tr><td width="100" align="left" bgcolor="#999999"><table width="50" border="0" cellpadding="5" cellspacing="5"><tr><td align="left" bgcolor="#FFFFFF">左</td></tr><tr><td align="center" bgcolor="#FFFFFF">中</td></tr><tr><td align="right" bgcolor="#FFFFFF">右</td></tr></table></td><td width="100" align="center" bgcolor="#999999"><table width="50" border="0" cellpadding="5" cellspacing="5"><tr><td align="left" bgcolor="#FFFFFF">左</td></tr><tr><td align="center" bgcolor="#FFFFFF">中</td></tr><tr><td align="right" bgcolor="#FFFFFF">右</td></tr></table></td><td width="100" align="right" bgcolor="#999999"><table width="50" border="0" cellpadding="5" cellspacing="5"><tr><td align="left" bgcolor="#FFFFFF">左</td></tr><tr><td align="center" bgcolor="#FFFFFF">中</td></tr><tr><td align="right" bgcolor="#FFFFFF">右</td></tr></table></td></tr><tr><td align="left" bgcolor="#999999">左</td><td align="center" bgcolor="#999999">中</td><td align="right" bgcolor="#999999">右</td></tr></table> --------------------------------- 上記のソースの様に、テーブルを縦2段、横2列にセルを作り、上段はテーブルタグ、下段はテキストでそれぞれalign属性をleft、center,rightと設定しています。 ところがInternet Explorer 5.2 for Macで見ると、 上段右のテーブルタグは「align="right"」の効果が出ていません。 この質問を呼んでいる回答者様には、ブラウザでどう表示されるんでしょうか？ どう表示されたかという結果とブラウザ名を教えて下さい。
- ベストアンサー
- HTML
- Netscape7.1 での表示方法を教えてください。
初めまして。 現在ホームページを作成中なのですが、以下のソースでページを表示しようとすると、 Netscape7.1だけ正しく表示されません。素人考えなのですがNetscapeではテーブル タグのheight="%"が無視されているように思えます。Netscapeで正しく表示される方 法をお教え下さると幸いです。よろしくお願い致します。 <html> <head> </head> <body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <div style="text-align:center"> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" style="margin:auto;text-align:left"> <tr> <td height="6%" align="center" valign="center" bgcolor="#000000"></td> </tr> <tr> <td align="left" valign="top"> <iframe name="contents" src="a.html" width="100%" height="100%" style="border:solid 0pt;border-color:#000000;" scrolling="no" frameborder="0" allowtransparency="true"></iframe></td> </tr> <tr> <td height="6%" align="center" valign="center" bgcolor="#000000"></td> </tr> </table> </div> </body> </html>
- ベストアンサー
- HTML
- テーブルの縦が縮まらない
質問させて下さい。テーブルで表を作ったのですが、縦幅が 縮まらなく困っています。 具体的には、セル内の余白を５ピクセルにしているのですが テキストとセルの境界線の縦の距離が何倍も開いてしまいます。 ソース↓ （ボディ内はこれで全てです。テキストを変えただけです。 使用ソフトはドリームウィーバー８） --------------------------------------------------------- <table width="490" height="395" cellpadding="0" cellspacing="0" bgcolor="#666666"> <tr> <td width="490" height="393"> <table width="100%" height="100%" border="0" cellpadding="5" cellspacing="1"> <tr> <td width="121" height="35" align="center" valign="middle" bgcolor="#FFCCFF"><font color="#333333" size="2">ああああ</font></td> <td width="344" height="35" align="left" valign="middle" bgcolor="#FFFFFF"><font color="#333333" size="2">あああああああああ</font></td> </tr> <tr> <td height="22" align="center" valign="middle" bgcolor="#FFCCFF"><font color="#333333" size="2">ああああ</font></td> <td align="left" valign="middle" bgcolor="#FFFFFF"><font color="#333333" size="2">あああああああああ</font></td> </tr> </table> </td> </tr> </table> --------------------------------------------------------- 試したこと：各セルの縦幅を揃えて指定してみる。指定を全て 外してから、再度調節してみる。セル内のテキスト 表示位置を上位置に設定してみるなどです。。。 どこかすごい見落としをしているのでしょうか。よろしくお願い します。
- ベストアンサー
- HTML
お礼
ご丁寧にありがとうございました。 実はこのページには別にcssファイルが指定してあり、それとの 関係でうまくいかなかったようです。 ご親切に教えていただきありがとうございます。 やる気だけはあるものの、ｈｔｍｌって何？レベルの超初心者が 企業のホームページ更新の仕事をさせていただくことになり 頭から煙をだしつつも、「知る」ことが楽しい毎日です。 私もいつか、naokitaさんのように、誰かにアドバイスできる くらいになれるよう日々精進していくつもりです！