• ベストアンサー

1ページにテーブルを複数設定・一括変更の方法について

一つのページに複数(十数個)を設置する場合 まとめて設置する方法はあるのでしょうか? また、サイズ等を変更したい場合も 一括して変更する方法はあるのでしょうか? 例えば、以下の物を数十個設置する場合 設置自体は簡単なのですが、変更が・・、 どうにか簡単にできる方法があればご教授下さい。 <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> 宜しくお願いします。

noname#76175
noname#76175
  • HTML
  • 回答数2
  • ありがとう数4

質問者が選んだベストアンサー

  • ベストアンサー
回答No.2

CSSで設定すれば良いです。 http://www.tagindex.com/index.html

noname#76175
質問者

お礼

ありがとうございます。 早速、挑戦してみます。

その他の回答 (1)

  • ww-_-ww
  • ベストアンサー率51% (46/89)
回答No.1

サイズだけであればスタイルシートでレイアウトをオートでできると思います。 TABLE { table-layout: auto; width: 600px; } また、一括変更で簡単なので言えば、テキストエディタで一括置換すれば良いのでは? ご希望の答えになってませんかね?(^^;)

noname#76175
質問者

お礼

ありがとうございます。 CSSでの設定に挑戦してみます。

関連するQ&A

  • テーブルだらけのページをスッキリさせたい

    いま、ホームページビルダーで趣味のサイトを作っているところなのですが、 HTMLのことでわからない事があるので教えてください。 現在、大きなテーブルの中にさらに小さなテーブルをいれています。 そのためタグがとてもごちゃごちゃしています。 小さなテーブルはサイト更新の度に追加していく予定なので、 見た目よりデータが重いページになってしまうと思います。 これをなんとかスッキリさせたいのですが 良い方法はあるでしょうか? スタイルシートを使えばいいのでしょうか? どのように使用すれば無駄の無い形になるか 具体的なアドバイスをいただけると助かります。 参考までに作りかけのタグを載せました。 悪い部分等があったら、ぜひお願いします。 よろしくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>サイト名「タイトル未定」</TITLE> </HEAD> <BODY> <CENTER> <TABLE border="0" cellpadding="0" cellspacing="0" width="840"> <TBODY> <TR> <TD colspan="2" align="center" height="40">サイト名 タイトル</TD> </TR> <TR> <TD colspan="2" align="center">サイトの説明と注意事項</TD> </TR> <TR> <TD colspan="2" height="15"> <HR> </TD> </TR> <TR> <TD align="center"> <TABLE border="1" cellpadding="2" cellspacing="1" bordercolor="#000000"> <TBODY> <TR> <TD rowspan="3" width="100" height="100" align="center" bgcolor="#009900">花の写真</TD> <TD width="80"><FONT size="-1">花の名前</FONT></TD> <TD width="150"><FONT size="-1">チューリップ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">分類</FONT></TD> <TD width="150"><FONT size="-1">あああああ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">撮影日</FONT></TD> <TD width="150"><FONT size="-1">2008年4月1日</FONT></TD> </TR> <TR> <TD colspan="3" height="80"><FONT size="-1">花の特徴など<BR> あああああああああああああああああああ<BR> いいいいいいいいいいいいいいいいいいいいいいいい<BR> うううううううううううううううううううううううう。</FONT></TD> </TR> </TBODY> </TABLE> <BR> </TD> <TD align="center"> <TABLE border="1" cellpadding="2" cellspacing="1" bordercolor="#000000"> <TBODY> <TR> <TD rowspan="3" width="100" height="100" align="center" bgcolor="#999900">花の写真</TD> <TD width="80"><FONT size="-1">花の名前</FONT></TD> <TD width="150"><FONT size="-1">さくら</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">分類</FONT></TD> <TD width="150"><FONT size="-1">あああああ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">撮影日</FONT></TD> <TD width="150"><FONT size="-1">2008年4月2日</FONT></TD> </TR> <TR> <TD colspan="3" height="80"><FONT size="-1">花の特徴など<BR> あああああああああああああああああああ<BR> いいいいいいいいいいいいいいいいいいいいいいいい<BR> うううううううううううううううううううううううう。</FONT></TD> </TR> </TBODY> </TABLE> <BR> </TD> </TR> <TR> <TD align="center"></TD> <TD align="center"></TD> </TR> <TR> <TD colspan="2"> <HR> </TD> </TR> </TBODY> </TABLE> </CENTER> </BODY> </HTML>

  • テーブルが崩れる問題について

    このような場合赤色の部分が17:00の真中に来るようにするにはどうしたらいいんでしょうか? <table height="15%" border="0" cellpadding="5" cellspacing="1" bgcolor="#CCCCCC"> <tr> <td height="33%">&nbsp;</td> <td colspan="2" align="center">10:00</td> <td colspan="2" align="center">11:00</td> <td colspan="2" align="center">12:00</td> <td colspan="2" align="center">13:00</td> <td colspan="2" align="center">14:00</td> <td colspan="2" align="center">15:00</td> <td colspan="2" align="center">16:00</td> <td colspan="2" align="center">17:00</td> <td colspan="2" align="center">18:00</td> <td colspan="2" align="center">19:00</td> <td colspan="2" align="center">20:00</td> </tr> <tr> <td height="33%" bgcolor="#FFFFFF">27日</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td colspan="9" bgcolor="#FF0000">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> <td bgcolor="#FFFFFF">&nbsp;</td> </tr> </table>

    • ベストアンサー
    • HTML
  • HTMLタグでテーブル枠を曲線で記述したい

    添付画像は「オークションプレートメーカー2」のテンプレートで、少しアレンジしようと思っています。 最上部の角が丸くなっていますが、下記のどの部分にあたるのでしょうか? すみませんが教えてください。 <br><center> <table cellspacing=0 border=0 cellpadding=0 width=550> <tr> <td width=1></td> <td width=1></td> <td width=1></td> <td width=2></td> <td width=2></td> <td width=536></td> <td width=2></td> <td width=2></td> <td width=1></td> <td width=1></td> <td width=1></td> </tr> <tr> <td height=1 colspan=4></td> <td height=1 bgcolor=#FF6666></td> <td rowspan=5 bgcolor=#FF6666 align=center> <font color=#FFFFFF size=5><b> </b></font> </td> <td height=1 bgcolor=#FF6666></td> <td height=1 colspan=4></td> </tr> <tr> <td height=1 colspan=3></td> <td height=1 colspan=2 bgcolor=#FF6666></td> <td height=1 colspan=2 bgcolor=#FF6666></td> <td height=1 colspan=3></td> </tr> <tr> <td height=1 colspan=2></td> <td height=1 colspan=3 bgcolor=#FF6666></td> <td height=1 colspan=3 bgcolor=#FF6666></td> <td height=1 colspan=2></td> </tr> <tr> <td height=2></td> <td height=1 colspan=4 bgcolor=#FF6666></td> <td height=1 colspan=4 bgcolor=#FF6666></td> <td height=2></td> </tr> <tr> <td colspan=5 bgcolor=#FF6666><br><br></td> <td colspan=5 bgcolor=#FF6666><br><br></td> </tr> <tr> <td colspan=5 bgcolor=#FF6666></td> <td> <table width=100% cellspacing=5 border=0 cellpadding=10 bgcolor=#FFCC66> <tr> <td align=left bgcolor=#FFF0F0> <font color=#993333 size=3> </font> </td> </tr> </table> </td> <td colspan=5 bgcolor=#FF6666></td> </tr> <tr> <td height=7 colspan=11 bgcolor=#FF6666></td> </tr> <tr> <td height=2 colspan=11></td> </tr> <tr> <td height=2 colspan=11 bgcolor=#FF6666></td> </tr> </table> <br> <font color="#999999" size=1>+ + + この商品説明は</font> <a href="http://www.auclinks.com/" target="_blank"><font color="#666666" size=1>オークションプレートメーカー2</font></a> <font color="#999999" size=1>で作成しました  + + +</font><font color="#FFFFFF" size=1><br>No.113.002.002</font><br> </center>

    • ベストアンサー
    • HTML
  • テーブルについて

    二つスライドが重なったようなテーブルを作りたいんですけど、一応、下記はそのように表示されたのですが、見え方で言うと、スライドの一枚目に文字を入れると、二枚目のスライドの形がずれてしまうのですがどうすればいいでしょう? <TABLE width="636" cellspacing="0"> <TBODY> <TR> <TD bgcolor="#0080ff" colspan="3" rowspan="2"></TD> <TD width="20" height="20"></TD> </TR> <TR> <TD bgcolor="#97cbff" width="20"></TD> </TR> <TR> <TD height="20" width="20"></TD> <TD bgcolor="#97cbff" colspan="2" width="596"></TD> <TD bgcolor="#97cbff" width="20" height="20"></TD> </TR> </TBODY> </TABLE>

    • ベストアンサー
    • HTML
  • 初めてHPを作成してるんですが

    素材の置いてあるサイトから、テーブルをダウンロードしました。 けどどうやって使えばいいのかわかりません。 コレ↓でやっても、画像がでません。 何が足りないのか教えていただけませんか?? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>テーブル設置例</TITLE> </HEAD> <BODY bgcolor="#FFFFCC"> <CENTER> <TABLE cellpadding="0" cellspacing="0"> <TBODY> <TR> <TD colspan="5" background="画像のURL" height="27" bgcolor="#FFFFFF"></TD> </TR> <TR> <TD bgcolor="#FFFFFF"></TD> <TD rowspan="2" valign="bottom" bgcolor="#FFFFFF"><IMG src="画像のURL" width="100" height="171" border="0"></TD> <TD width="280" height="250" bgcolor="#FFFFFF" align="center"><FONT size="-1">文章BR> 文章<BR> <BR> 文章</FONT></TD> <TD rowspan="2" valign="bottom" bgcolor="#FFFFFF"><IMG src="画像のURL" width="100" height="171" border="0"></TD> <TD bgcolor="#FFFFFF"></TD> </TR> <TR> <TD valign="bottom"><IMG src="画像のURL" width="20" height="23" border="0"></TD> <TD background="画像のURL" height="23"></TD> <TD valign="bottom"><IMG src="画像のURL" width="20" height="23" border="0"></TD> </TR> </TBODY> </TABLE> </CENTER> </BODY> </HTML> windows98・IE6,0でメモ帳を使って作成しています。 超初心者のくせにかなり無謀なんでしょうかー さっぱりわかりません。。。 何か補足することがありましたら、お知らせください ご回答どうぞよろしくお願いいたします・・!

  • テーブルの上下線を消したい

    タイトル通り、テーブルの上下だけの線を消したいのですが、 どのように書けば消えるのでしょうか? 一応今のものは <TABLE border="0" width="290" bgcolor="#ffffff" cellspacing="1" cellpadding="10" style="border:dotted 1px #000000"> <TBODY> <TR><TD valign="top" align="right" width="290" bgcolor="#ffffff" height="800"> <P> </P><p> </p> <DIV align="right"> ○○○ </DIV> </TD> </TR> </TBODY> </TD> </TR> </TBODY> </TABLE> です。お願いします。

    • ベストアンサー
    • HTML
  • safariで特定条件下でデーブル幅が効かなくなります

    safariでcolspanでセルを結合し、その中に大きい要素(下の例ですとwidth500pxの画像や、文字数60のテキスト領域)を入れると、他の行の幅が変わってしまいます。 スタイルシートでtd幅を指定してやったりしてみたのですが、どうしても幅が変わってしまいます。 何か解決方法等ございましたら、ご教授願います。 <table width="600" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20%" align="center" bgcolor="#99FFFF">20%</td> <td width="80%" align="center">80%</td> </tr> <tr> <td colspan="2" align="center" bgcolor="#FFCCCC"><img src="http://cmm001.goo.ne.jp/img/sn/sn_50.gif" width="500" height="24"></td> </tr> </table> <br> <table width="600" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20%" align="center" bgcolor="#99FFFF">20%</td> <td width="80%" align="center">80%</td> </tr> <tr> <td colspan="2" align="center" bgcolor="#FFCCCC"><form name="form1" method="post" action=""> <textarea name="textarea" cols="60"></textarea> </form> </td> </tr> </table> <br> <table width="600" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20%" align="center" bgcolor="#99FFFF">20%</td> <td width="80%" align="center">80%</td> </tr> <tr> <td colspan="2" align="center" bgcolor="#FFCCCC">&nbsp;</td> </tr> </table>

    • ベストアンサー
    • HTML
  • 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
  • tableがずれる理由がわかりません

    上のテーブルはずれないのですが 同じレイアウトの下のテーブルはずれます。 widthの指定がききません。 なぜでしょう?? 前からこの現象はしていたのですが理由が知りたいです。 <table border="1" cellpadding="0" cellspacing="1"> <tr height="10" bgcolor="#cccccc"> <td width="50" bgcolor="#ffffff" colspan="5"><img src="../../img/spacer.gif" width="50" height="10"></td> </tr> <tr height="10" bgcolor="#cccccc"> <td width="30" bgcolor="#ffffff" colspan="3"><img src="../../img/spacer.gif" width="30" height="10"></td> <td width="20" colspan="2"><img src="../../img/spacer.gif" width="20" height="10"></td> </tr> <tr height="10" bgcolor="#cccccc"> <td width="10" bgcolor="#ffffff"><img src="../../img/spacer.gif" width="10" height="10"></td> <td width="40" colspan="4"><img src="../../img/spacer.gif" width="40" height="10"></td> </tr> <tr height="10" bgcolor="#cccccc"> <td width="10" bgcolor="#ffffff"><img src="../../img/spacer.gif" width="10" height="10"></td> <td width="10"><img src="../../img/spacer.gif" width="10" height="10"></td> <td width="10"><img src="../../img/spacer.gif" width="10" height="10"></td> <td width="10"><img src="../../img/spacer.gif" width="10" height="10"></td> <td width="10"><img src="../../img/spacer.gif" width="10" height="10"></td> </tr> </table> <br /> <br /> <table border="1" cellpadding="0" cellspacing="1"> <tr height="10" bgcolor="#cccccc"> <td width="50" bgcolor="#ffffff" colspan="5"><img src="../../img/spacer.gif" width="50" height="10"></td> </tr> <tr height="10" bgcolor="#cccccc"> <td width="30" bgcolor="#ffffff" colspan="3"><img src="../../img/spacer.gif" width="30" height="10"></td> <td width="20" colspan="2"><img src="../../img/spacer.gif" width="20" height="10"></td> </tr> <tr height="10" bgcolor="#cccccc"> <td width="10" bgcolor="#ffffff"><img src="../../img/spacer.gif" width="10" height="10"></td> <td width="40" colspan="4"><img src="../../img/spacer.gif" width="40" height="10"></td> </tr> <tr height="10" bgcolor="#cccccc"> <td width="10" bgcolor="#ffffff"><img src="../../img/spacer.gif" width="10" height="10"></td> <td width="40" colspan="4"><img src="../../img/spacer.gif" width="40" height="10"></td> </tr> </table>

  • HTMLでタイムスケジュールを作成しています。

    HTMLでタイムスケジュールを作成しています。 ブラウザはIE7です。 左側の「No.」~「氏名」は固定です。 タイムスケジュールの部分に横スクロールを表示させ、ブラウザの横スクロールは使用しません。 1分単位で表示させたいのですが、どうしてもレイアウトが崩れてしまいます。 (添付の図ぐらいの間隔にしたいです。1分を1~3pxぐらいでしょうか。) 下記のHTMLは作成中のものですが、文字数制限のため一部を省略しています。 <table width="100%"> <td> <table width="310" align="left" border="1" cellspacing="0"> <tr> <td rowspan="2" width="10"><div align="center">No.</div></td> <td width="100"><div align="center">所属</div></td> <td width="100"><div align="center">部門</div></td> <td width="100"><div align="center">勤務区分</div></td> </tr> <tr> <td width="100"><div align="center">区分詳細</div></td> <td width="100"><div align="center">階級</div></td> <td width="100"><div align="center">氏名</div></td> </tr> <tr align="middle"> <td rowspan="2" height="50">1</td> <td>所</td> <td>部</td> <td>区</td> </tr> <tr align="middle"> <td>詳</td> <td>階</td> <td>太郎</td> </tr> </table> <div style="overflow-x:scroll; overflow-y:visible;"> <table height="100%" border="1" cellspacing="0"> <tr> <td colspan="60" align="center">08</td> <td colspan="60" align="center">09</td> <td colspan="60" align="center">10</td> </tr> <tr> <td colspan="15" align="right">15</td> <td colspan="15" align="right">30</td> <td colspan="15" align="right">45</td> <td colspan="15" align="right">60</td> <td colspan="15" align="right">15</td> <td colspan="15" align="right">30</td> <td colspan="15" align="right">45</td> <td colspan="15" align="right">60</td> <td colspan="15" align="right">15</td> <td colspan="15" align="right">30</td> <td colspan="15" align="right">45</td> <td colspan="15" align="right">60</td> </tr> <tr align="center"> <td colspan="100" bgcolor="lightpink" height="50">未</td> <td bgcolor="lightblue"></td> <td bgcolor="gold"></td> <td bgcolor="lightblue"></td> <td bgcolor="gold"></td> <td bgcolor="lightblue"></td> <td bgcolor="gold"></td> <td bgcolor="lightblue"></td> <td bgcolor="gold"></td> <td bgcolor="lightblue"></td> <td bgcolor="gold"></td> <td colspan="70" bgcolor="lightgreen">仕</td> </tr> </table> </div> </td> </table>

    • ベストアンサー
    • HTML

専門家に質問してみよう