段落 

<h>〜</h>タグで囲んだ文字は見出しとなり、文字のサイズを指定できます
<p>〜</p>タグで囲んだ文字はひとかたまりの段落となり、この段落の前後に空白が入ります
<div>〜</div>タグで囲んだ文字はひとかたまりの段落となり、この段落の前後には空白は入りません
<br>タグは改行をする時に使います

クリックで拡大 使用例
<h1>見出し<h1>
<h2>見出し<h2>
<h3>見出し<h3>
<h4>見出し<h4>
<h5>見出し<h5>
<h6>見出し<h6>
改行になります<br>改行になります<br><br>

<p>前後に空白が入る段落</p>

<br><br>

<div>前後に空白が入らない段落</div>

とメモ帳に入力してIEで開くと右上の画面ように表示されます

WEBサイト作成ランキング
基本構造 | トラックバック(-) | CM(0)

リスト 

リストを作成するには、<ul>〜</ul>(箇条書きリストの定義)や<ol>〜</ol>(番号付きリストの定義)が必要になります
それぞれのタグの間に<li>〜</li>(項目の指定)を挿入すると、それぞれのリストが表示されます

クリックで拡大 例1
<ul>
<li>箇条書きリストは</li>
  <ul>
  <li>作成できる</li>
  <li>作成できない</li>
  </ul>
</ul>
と入力してIEで開くと右画面のように表示されます

クリックで拡大 例2
<ol>
<li>
番号付きリストは</li>
 <ol>
 <li>>
作成できる</li>
 <li>
作成できない</li>
</ol>
</ol>
と入力してIEで開くと右画面のように表示されます

WEBサイト作成ランキング
基本構造 | トラックバック(-) | CM(0)

表組 

<table>〜</table>タグは表組を定義します 表を作る場合に必ず必要なタグです
<tr>〜</tr>タグは表の1行になります 表の行数分の<tr>〜</tr>タグを使用します
<th>〜</th>タグは表の見出しとなり、1マスの中央に 文字が配置されます
<td>〜</td>タグは表の1マスの項目になります


下記のようにメモ帳に入力してIEで開くと右画面のように表示されます
クリックで拡大 <table border="1">
  <tr>
     <th>見出し1</th>
     <th>見出し2</th>
     <th>見出し3</th>
  </tr>
  <tr>
     <td>表をマスター1</td>
     <td>表をマスター2</td>
     <td>表をマスター3</td>
  </tr>
  <tr>
     <td>
簡単ホームページ1</td>
     <td>簡単ホームページ2</td>
     <td>簡単ホームページ3</td>
  </tr>
</table>


WEBサイト作成ランキング
基本構造 | トラックバック(-) | CM(0)

リンク 

リンクとは、本ページから他ページへの移動する事をいいます
リンクタグは<a href="ページのURLかファイル名">リンクさせる文字</a>で構成されます
では早速、作成してみましょう

クリックで拡大 まずメモ帳を起動し、保存したサンプルページを呼び出します
呼び出したサンプルページの<body>〜</body>の間に
<a href="sample2.html">sample2へ移動します</a>
<br><br>
<a href="http://www.google.com/intl/ja/">グーグルへ移動します</a>

と入力し、ファイル〜上書き保存をしてください

クリックで拡大 サンプルページの上書き保存ができましたら、その状態でファイル〜名前を付けて保存を選択します
次にファイル名を sample2.html に変更し、保存をクリックします

クリックで拡大 その時、左上部のメモ帳の隣にSAMPLE2と表示されたのを確認して下さい

クリックで拡大 すでにサンプルページに記入しているので
<br><br>
<a href="http://www.google.com/intl/ja/">グーグルへ移動します</a>
の部分を削除します


クリックで拡大 そして <a href="sample2.html">sample2へ移動します</a>sample2sampleに変更し、ファイル〜上書き保存をします



クリックで拡大 マイドキュメントを開くと samplesample2 のファイルが表示されました



クリックで拡大 サンプルページを開くとサンプル2へのリンクとグーグルサイトへのリンクが貼られています
「sample2へ移動します」をクリックするとサンプル2のページへ移動します



クリックで拡大 移動したサンプル2のページには、サンプルページへのリンクが貼られています
「sampleへ移動します」をクリックするとサンプルページへ移動します


基本構造 | トラックバック(-) | CM(0)

カラーコード 

文字色や背景色を変更する場合に、このカラーコードが必要になります
とりあえずは、標準色の16色で十分だと思います

#FFFFFF #FF0000 #000080 #008000
#000000 #800000 #0000FF #00FF00
#808080 #800080 #00FFFF #808000
#C0C0C0 #FF00FF #008080 #FFFF00


WEBサイト作成ランキング
基本構造 | トラックバック(-) | CM(0)