フォーム関連機能（3）

演習課題（1）解答例 type属性は、InternetExploereが未対応ななため積極的に使う段階ではありません <html lang="ja"> <head> <meta charset="UTF-8"> <title>HTML5でお問い合わせフォーム</title> <style> th { text-align: left; } span.red { color: #F00; } span.small { font-size: small; } </style> </head> <body> <header> <h1>お問い合わせフォーム</h1> <…</header></body></html>

2014-07-30

フォーム関連機能（2）

フォーム関連機能まとめ required属性入力必須を指定します placeholder属性入力欄に初期値として表示されます autofocus属性自動フォーカスを指定する IE6・7対応する場合は「autofocus="autofocus"」と記述します autocomplete属性入力候補を提示して…

2014-07-29

フォーム関連機能（1）

フォーム関連の新機能 input要素の新しいtype属性 email メールアドレス search 検索テキスト url URL tel 電話番号 number 数値 date 日付 datetime UTC datetime-local ローカル日時 month 月 week 週 time 時間 range 範囲 color 色フォーム関連の新しい…

2014-07-28

フォームの新属性

HTML5フォームの新属性 HTML5で追加されたフォーム関連の機能フォームコントロールこれまでのHTMLにあったテキストボックスやラジオボタンなどの入力フォーム要素に、電話番号やメールアドレスなどに特化した属性が追加されましたその他、数値や日付など…

2014-07-27

まとめ練習問題

練習問題（2） form（1）フォームに入力したデータを送信する際の送信方法の指定はタグのどの属性に行うか id属性 method属性 action属性 class属性 form（2）フォームに入力したデータを送信する際の遷移先の指定はタグのどの属性に行うか id属性 method…

2014-07-26

入力された値を取得（２）

文字入力以外のフォーム要素ラジオボタンチェックボックスリストメニュー《input.php》 <html lang="ja"> <head> <meta charset="UTF-8"> <title>入力フォームあれこれ</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>入力フォームあれこれ</h1> <form name="input_form" action="output.php" method="post"> <table> <tr> <th>氏名</th> <…</tr></table></form></body></html>

2014-07-25

入力された値を取得（１）

リクエスト情報を取得するリクエスト情報：クライアントからサーバーに送信される情報のこと HTTP（HyperText Transfer Trotocol）の手続きに沿って通信をおこなっている HTTPプロトコルの構成分類項目概要リクエスト情報 HTTPメソッドサーバーに対す…

2014-07-24

送信データを受け取る

PHPで送信データを受け取る - テキストテキストボックス $_POST[ 'name' ]という変数に格納されている《input.php》 <html lang="ja"> <head> <meta charset="UTF-8"> <title>文字を入力する</title> </head> <body> <form action="request.php" method="post"> <label for="name">名前：</label> <input type="text" id="name" name="name"> </form></body></html>

2014-07-23

フォームの各部品

お問い合せフォーム各部品の確認テキスト入力 <html lang="ja"> <head> <meta charset="UTF-8"> <title>お問い合わせ</title> </head> <body> <h1>お問い合わせフォーム</h1> <form action="#" method="post"> <p>名前：<input type="text" name="name" size="20" maxlength="10" value="お名前"></p> <p>内容：</p></form></body></html>