HTMLの基本的なルールについての勉強　part3 - HTMLの勉強|Webサイト作りの基礎

さて、HTMLの基本ルールについての勉強も今回が最後です。

HTMLの一通りの流れをご説明したつもりなので、今回の記事をしっかりと勉強していただければ、HTMLについては大体理解したといっていいでしょう。

といっても、私もまだまだ初心者なんですけどね笑

それでは、HTMLの基礎ルールについて、最後の勉強をしていきましょう。

表組み

table：table

tr：table row

th：table head

td：table description

<tableborder="1"summary="カリキュラム内容のイメージ">
<tr>
<th>科目</th>
<td>内容</td>
</tr>
<tr>
<th>国語</th>
<td>正しい文書構造を理解する（パラグラフの概念）</td>
</tr>
<tr>
<th>算数</th>
<td>JavaScript、ActionScript、PHPなどでプログラミングの考え方を理解する</td>
</tr>
<tr>
<th>理科</th>
<td>力学からコンピュータの描画を理解する</td>
</tr>
<tr>
<th>社会</th>
<td>デザインの歴史、Webの歴史を通じていま必要なことを理解する</td>
</tr>
<tr>
<th>英語</th>
<td>Webのバックグラウンドから理解するために必要な言葉の理解する</td>
</tr>
<tr>
<th>図工</th>
<td>デザインのルールを理解する</td>
</tr>
</table>

文字と枠の修飾は「CSS」でおこないます。

ただし、枠線が見えないと表組みが確認できないため、便宜上「border="1"」を指定します。

最終的には「CSS」設定後、削除します。

アドレス

「住所や電話番号」など、ページ内容の管理者の住所を明示するために使用します。

一般的には「著作マーク (c)」を明示する場合にも利用されています。

<address>らーめん一番<br>
〒171-0022 東京都新宿区西新宿○-○-○ ラーメン一番ビル　連絡先： 00-0000-0000</address>

水平線

hr：horizontal rule

リンク

Webは「リンク」こそ命です。

リンクには３つの使い方があります。

テキストリンク
画像リンク
メールリンク

<ahref="移動先のアドレス">◎◎◎のページへ移動</a>
<ahref="移動先のアドレス"><imgsrc="画像の住所"width="幅"height="高さ"alt="代替え文字"></a>
<ahref="xxx@xxx.net">お問い合わせ（メールソフトが起動します）</a>

a：anchor

href：hyper reference

新規ウィンドウで開く

target="_blank"

この属性は、HTMLの解釈の変遷により、使わないほうが良いといわれたりしましたが、HTML5では使用可能になっています。

<html>
<head>
<title>はじめてのHTML入力練習</title>
</head>
<body>
<h1>結論：大見出し</h1>
<p>要約</p>
<h2>結論：検証</h2>
<p>解説</p>
<ul>
<li>検証の項目</li>
<li>検証の項目</li>
<li>検証の項目</li>
</ul>
<p>解説</p>
<ol>
<li>順序のある検証の項目</li>
<li>順序のある検証の項目</li>
<li>順序のある検証の項目</li>
</ol>
<dl>
<dt>7月23日</dt>
<dd>HTMLの勉強を始めます。</dd>
<dt>7月24日</dt>
<dd>HTMLでwebページを作ってみましょう</dd>
<dt>7月25日</dt>
<dd>定義型リストと表組みの練習</dd>
</dl>
<tableborder="1"summary="カリキュラム内容のイメージ">
<tr>
<th>科目</th>
<td>内容</td>
</tr>
<tr>
<th>国語</th>
<td>正しい文書構造を理解する（パラグラフの概念）</td>
</tr>
<tr>
<th>算数</th>
<td>JavaScript、ActionScript、PHPなどでプログラミングの考え方を理解する</td>
</tr>
<tr>
<th>理科</th>
<td>力学からコンピュータの描画を理解する</td>
</tr>
<tr>
<th>社会</th>
<td>デザインの歴史、Webの歴史を通じていま必要なことを理解する</td>
</tr>
<tr>
<th>英語</th>
<td>Webのバックグラウンドから理解するために必要な言葉の理解する</td>
</tr>
<tr>
<th>図工</th>
<td>デザインのルールを理解する</td>
</tr>
</table>
<address>ラーメン一番<br>
〒000-0000 東京都新宿区西新宿○ー○―○　連絡先：00-0000-0000 03-3981-7201</address>
</body>
</html>