• ベストアンサー

</form>を書くとズレる

こんばんは ホームページを作成していて、疑問に思うのですが、入力フォームを作成していてテーブルの中に</form>タグを記述すると、テーブルが壊れてしまいます。 </form>を外すと正常に表示されて、</form>をつけるとズレます。 記述する場所も直下に書いたり</td>の外や</table>の外に書いたりしますが、大丈夫の時とそうでない時があります。 他にもフォームがあるので、直下に記述したいのですが表が崩れてしまい困っています。 どのように対応したら良いか教えてください。 宜しくお願いします。

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

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

 なぜ最初に仕様書を見ないのでしょう。こんな場所で聞いたって正確な解答が得られることは少ないです。 <!ELEMENT TABLE - -   (CAPTION?, (COL*|COLGROUP*), THEAD?, TFOOT?, TBODY+)>  ⇒11.2.1 TABLE要素( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/tables.html#h-11.2.1 ) 意味は --   開始タグ終了タグとも省略できない CAPTION? ひとつかゼロ(?) (COL*|COLGROUP*) COLゼロ個以上(*)またはCOLGROUPゼロ個以上 THEAD?  ひとつかゼロ個 TFOOT?  ひとつかゼロ個以上 TBODY+  ひとつ以上  しかTABLEの直下には入りません。TRも本当は置けないが <!ELEMENT TR - O (TH|TD)+ -- table row -->  ⇒11.2.5 表の行: TR要素( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/tables.html#h-11.2.5 ) - O  開始タグ省略不可(必須) 終了タグ省略可能 (TH|TD)+ THないしTDがひとつ以上 読み方は・・慣れたら難しくないというか読み方は身につけておくこと  ⇒3.3.3 要素宣言( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/sgmltut.html#h-3.3.3 ) 整理すると FORMの中に入れられる要素  <ADDRESS> <BLOCKQUOTE> <DIV> <DL> <FIELDSET> <H1> <H2> <H3> <H4>  <H5> <H6> <HR> <NOSCRIPT> <OL> <P> <PRE> <SCRIPT> <TABLE> <UL> FORMが存在しうる親要素  <BLOCKQUOTE> <BODY> <DD> <DEL> <DIV> <FIELDSET> <INS> <LI> <MAP>  <NOSCRIPT> <OBJECT> <TD> <TH> だけです。  <table>や<tr>に</form>を書くと、ブラウザは判断できなくなります。そのため適当に要素を追加してなんとか表示できるように工夫します。・・・それが崩れる原因です。 >他にもフォームがあるので、直下に記述したいのですが表が崩れてしまい困っています。  他のフォームがあるのでしたら、文書構造上ひとつのtableに入れてはなりません。  必ず別のtableになるはずです。  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ★ひょっとしてTABLEを配置やデザインのために使用しているのではないですよね。それは論外です。  →『単に文書内容を整形する目的だけで表を用いるべきでない。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/tables.html#h-11.1 )』  →『 ⇒ページレイアウトの目的で表を用いる。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )』  きちんと、インデントさせてHTMLを書くようにしましょう。 <form action="./cgi1" method="post">  <table summary="form">   <tbody>    <tr>     <th abbr="氏名">お名前</th>     <td><input type="text" name="name" size="10" value=""></td>  ・・・・  </table> </form> <form action="./cgi2" method="post">  <table summary="form">   <tbody>    <tr>     <th abbr="氏名">お名前</th>     <td><input type="text" name="name" size="10" value=""></td>  ・・・・  </table> </form>  送信先をひとつのプログラムにして、submitの値で処理を分けても良いでしょう。 <form action="./cgi1" method="post">  <table summary="form">   <tbody>    <tr>     <th abbr="氏名">お名前</th>     <td><input type="text" name="name" size="10" value=""></td>  ・・・・    <tr>     <th abbr="送信">送信</th>     <td><input type="submit" name="submit1" value="送信">    </tr>    <tr>     <th abbr="氏名">お名前</th>     <td><input type="text" name="name" size="10" value=""></td>  ・・・・    <tr>     <th abbr="送信">送信</th>     <td><input type="submit" name="submit2" value="送信">    </tr>  </table> </form> とか・・  

arisa_551
質問者

お礼

arisa_551様感謝します。 本当に勉強になります。 恥をしのんで質問したので、初心者の私にとってはとても参考になりました。 これから参考にしてやってみたいと思います。 どうもありがとうございました。

関連するQ&A