概要
HTML基本フォーマットの作成
内容
HTML基本フォーマットの作成をします。
今後の工程でJavaScriptにより動的にタグを出力する際のテンプレートとなります。
HTML構成
・タイトル
・要約
・検索メニュー
・年月での絞込
・検索ボタン
・リスト
・ヘッダー
・各リスト
ソースコード
studistory.html
<!doctype html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>studistory</title> </head> <body> <header> <h1 id="title">studistory</h1> <p id="summary">学習履歴管理を行います</p> </header> <section id="search"> <form name="studistoryform" id="studistoryform"> <p><input type="month" /></p> <p><input type="submit" value="search" /></p> </form> </section> <section id="list"> <table id="list" border="1"> <thead> <tr> <th>todo date</th> <th>subject</th> <th>summary</th> <th>estimate</th> <th>start</th> <th>end</th> <th>total</th> </tr> <tbody> <tr id="2013091"> <td id="tododate1">20130905</td> <td id="subject1">準備</td> <td id="summary1">日次 作業準備 アクティビティの割り当て メールチェック</td> <td id="estimate1">0.5</td> <td id="start1">2013/09/06 01:32:20</td> <td id="end1">2013/09/06 01:48:40</td> <td id="total1">0:16:20</td> </tr> <tr id="2013092"> <td id="tododate2">20130905</td> <td id="subject2">アルゴリズム</td> <td id="summary2">アルゴリズム クイックソート</td> <td id="estimate2">2</td> <td id="start2">2013/09/06 01:48:42</td> <td id="end2">2013/09/06 02:00:24</td> <td id="total2">0:11:42</td> </tr> </tbody> </thead> </table> </section> </body> </html>