HTML3 〜テーブル(表)〜
下記のWebページを作成してください。
設定手順
デスクトップ上にフォルダ「webst8」を作成します(すでに作成済みの場合は不要です)。
「webst8」フォルダ上に、「html-lesson3」フォルダを作成します。
「html-lesson3」フォルダ上にファイル名「lesson3.html」を新規作成してWebページを作成します。
くだものの画像は下記をダウンロードして利用してください。
gazo-html-lesson3
ヒント
Atomを利用すると簡単にHTMLの基本構造を作成できます。
利用するタグは下記になります。
- 見出しタグ h1,h2
- テーブルタグ table
- 画像タグ img
参考サイト：3-8. テーブルタグ table | 初心者がはじめに覚えておきたい HTML の基本とタグを紹介
こたえ
下記zipファイルに答えを格納しています。
html-lesson3
ソースコード
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>はじめてのHTML</title> </head> <body> <h1>はじめてのHTMLレッスン3</h1> <h2>商品一覧</h2> <table> <tr> <th>商品名</th> <th>値段</th> <th>商品画像</th> </tr> <tr> <td>りんご</td> <td>100円</td> <td><img src="images/apple.jpg" alt="りんご"></td> </tr> <tr> <td>もも</td> <td>200円</td> <td><img src="images/momo.jpg" alt="もも"></td> </tr> <tr> <td>スイカ</td> <td>1000円</td> <td><img src="images/suica.jpg" alt="スイカ"></td> </tr> </table> </body> </html> |