ファイル名：hollywood_cafe/4t/contact.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="description" content="ハリウッド・カフェはクリエイターが集まる創造空間カフェです。"> <meta name="keywords" content="カフェ,クリエイター,CAFE,作品,創造,空間"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>Contact | HOLLYWOOD CAFE</title> </head> <body> <!-- ヘッダ要素 ここから --> <h1><img src="images/top/hc_logo.png" alt="HOLLYWOOD_CAFE" width="140" height="170"></h1> <h2>クリエイターが集まり、作品が生まれる。創造空間カフェ。</h2> <p><a href="sitemap.html">Sitemap</a></p> <!-- ヘッダ要素 ここまで --> <hr> <!-- ナビゲーション ここから --> <ul> <li><a href="top.html"><img src="images/top/navi_home.jpg" alt="Home" width="120" height="30"></a></li> <li><a href="about.html"><img src="images/top/navi_about.jpg" alt="About" width="120" height="30"></a></li> <li><a href="menu.html"><img src="images/top/navi_menu.jpg" alt="Menu" width="120" height="30"></a></li> <li><a href="access.html"><img src="images/top/navi_access.jpg" alt="Access" width="120" height="30"></a></li> <li><img src="images/top/navi_on_contact.jpg" alt="Contact" width="120" height="30"></li> </ul> <!-- ナビゲーション ここまで --> <hr> Home>Contact Contact ご予約、イベント、パーティ開催のお問い合わせ、そのほか当店へのご意見などは、下記お問い合わせフォームをご記入の上、送信ボタンをクリックして下さい。 <form name="form1" id="form1" method="POST" action="xxxxx.php"> <table cellpadding="0" cellspacing="0" summary="お問い合わせフォーム"> <caption>お問い合わせフォーム</caption> <tr> <th><label for="subject">お問い合わせ内容</label></th> <td> <select name="subject" id="subject"> <option value="選択してください" selected>選択してください</option> <option value="予約について">予約について</option> <option value="メニューについて">メニューについて</option> </select> </td> </tr> <tr> <th><label for="name">お名前</label></th> <td><input type="text" name="name" id="name" value="" size="20"></td> </tr> <tr> <th><label for="tel">電話番号</label></th> <td><input type="text" name="tel" id="tel" value="" size="20"></td> </tr> <tr> <th><label for="email">メールアドレス</labe>l</th> <td><input type="text" name="email" id="email" value="" size="20"></td> </tr> <tr> <th>ご連絡方法</th> <td> <input type="radio" name="contact" id="contact1" value="メール">メール <input type="radio" name="contact" id="contact2" value="電話">電話 </td> </tr> <tr> <th>当店を何でお知りになりましたか</th> <td> <input type="checkbox" name="magazine" id="magazine" value="雑誌">雑誌 <input type="checkbox" name="web" id="web" value="ホームページ">ホームページ <input type="checkbox" name="friend" id="friend" value="友人・知人">友人・知人 <input type="checkbox" name="signboard" id="signboard" value="看板">看板 <input type="checkbox" name="etc" id="etc" value="その他">その他 </td> </tr> <tr> <th><label for="free">自由記入欄</label></th> <td> <textarea name="free" id="free" cols="25" rows="5"></textarea> ※ご予約の場合は、希望日時をご記入ください。 </td> </tr> </table> </form> Recommended menu ハリウッド・バーガー 当店で毎日焼き上げる自家製のパンを使ったオリジナルハンバーガー ハリウッド・プレート お酒を飲みながら軽い食事を楽しんでいただける5点盛り合わせ More <!-- バナー ここから --> <ul> <li>お得なセットメニュー</li> <li><a href="http://www.sugiyama-style.tv/" target="_blank">オーナーブログ</a></li> </ul> <!-- バナー ここまで --> <!-- ページトップへのリンク ここから --> <p><a href="#pageTop">PageTop</a></p> <!-- ページトップへのリンク ここまで --> <hr> <!-- フッタ要素 ここから --> <address>Copyright 2007 HOLLYWOOD CAFE, ALL Rights Reserved.</address> <!-- フッタ要素 ここまで --> </body> </html>
ファイル名：hollywood_cafe/xt/contact.html
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="description" content="ハリウッド・カフェはクリエイターが集まる創造空間カフェです。" /> <meta name="keywords" content="カフェ,クリエイター,CAFE,作品,創造,空間" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>Contact | HOLLYWOOD CAFE</title> </head> <body> <!-- ヘッダ要素 ここから --> <h1><img src="images/top/hc_logo.png" alt="HOLLYWOOD_CAFE" width="140" height="170" /></h1> <h2>クリエイターが集まり、作品が生まれる。創造空間カフェ。</h2> <p><a href="sitemap.html">Sitemap</a></p> <!-- ヘッダ要素 ここまで --> <hr /> <!-- ナビゲーション ここから --> <ul> <li><a href="top.html"><img src="images/top/navi_home.jpg" alt="Home" width="120" height="30" /></a></li> <li><a href="about.html"><img src="images/top/navi_about.jpg" alt="About" width="120" height="30" /></a></li> <li><a href="menu.html"><img src="images/top/navi_menu.jpg" alt="Menu" width="120" height="30" /></a></li> <li><a href="access.html"><img src="images/top/navi_access.jpg" alt="Access" width="120" height="30" /></a></li> <li><img src="images/top/navi_on_contact.jpg" alt="Contact" width="120" height="30" /></li> </ul> <!-- ナビゲーション ここまで --> <hr /> Home>Contact Contact ご予約、イベント、パーティ開催のお問い合わせ、そのほか当店へのご意見などは、下記お問い合わせフォームをご記入の上、送信ボタンをクリックして下さい。 <form name="form1" id="form1" method="POST" action="xxxxx.php"> <table cellpadding="0" cellspacing="0" summary="お問い合わせフォーム"> <caption>お問い合わせフォーム</caption> <tr> <th><label for="subject">お問い合わせ内容</label></th> <td> <select name="subject" id="subject"> <option value="選択してください" selected="selected">選択してください</option> <option value="予約について">予約について</option> <option value="メニューについて">メニューについて</option> </select> </td> </tr> <tr> <th><label for="name">お名前</label></th> <td><input type="text" name="name" id="name" value="" size="20" /></td> </tr> <tr> <th><label for="tel">電話番号</label></th> <td><input type="text" name="tel" id="tel" value="" size="20" /></td> </tr> <tr> <th><label for="email">メールアドレス</labe></th> <td><input type="text" name="email" id="email" value="" size="20" /></td> </tr> <tr> <th>ご連絡方法</th> <td> <input type="radio" name="contact" id="contact1" value="メール" />メール <input type="radio" name="contact" id="contact2" value="電話" />電話 </td> </tr> <tr> <th>当店を何でお知りになりましたか</th> <td> <input type="checkbox" name="magazine" id="magazine" value="雑誌" />雑誌 <input type="checkbox" name="web" id="web" value="ホームページ" />ホームページ <input type="checkbox" name="friend" id="friend" value="友人・知人" />友人・知人 <input type="checkbox" name="signboard" id="signboard" value="看板" />看板 <input type="checkbox" name="etc" id="etc" value="その他" />その他 </td> </tr> <tr> <th><label for="free">自由記入欄</label></th> <td> <textarea name="free" id="free" cols="25" rows="5"></textarea> ※ご予約の場合は、希望日時をご記入ください。 </td> </tr> </table> </form> Recommended menu ハリウッド・バーガー 当店で毎日焼き上げる自家製のパンを使ったオリジナルハンバーガー ハリウッド・プレート お酒を飲みながら軽い食事を楽しんでいただける5点盛り合わせ More <!-- バナー ここから --> <ul> <li>お得なセットメニュー</li> <li><a href="http://www.sugiyama-style.tv/" target="_blank">オーナーブログ</a></li> </ul> <!-- バナー ここまで --> <!-- ページトップへのリンク ここから --> <p><a href="#pageTop">PageTop</a></p> <!-- ページトップへのリンク ここまで --> <hr /> <!-- フッタ要素 ここから --> <address>Copyright 2007 HOLLYWOOD CAFE, ALL Rights Reserved.</address> <!-- フッタ要素 ここまで --> </body> </html>
※ラベルとは、フォームを構成する部品とその項目名を関連付ける要素です。 ラベルを定義することにより、チェックボックスやラジオボタンは項目名を クリックして選択状態にすることができます。