読者です 読者をやめる 読者になる 読者になる

HTMLの勉強|Webサイト作りの基礎

初心者向けの向けのHTMLの勉強の仕方を綴っていきます。かくいう私もWebサイト作りの初心者です笑

HTMLの基本的なルールについての勉強 part3

さて、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>JavaScriptActionScriptPHPなどでプログラミングの考え方を理解する</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>

 

f:id:web-css-design:20110923135612j:image

 

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

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

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

 

アドレス

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

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

 

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

 

水平線

hr:horizontal rule

リンク

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

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

 

  1. テキストリンク
  2. 画像リンク
  3. メールリンク

 

<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>JavaScriptActionScriptPHPなどでプログラミングの考え方を理解する</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>