ドリル式ホームページの作り方

リストを使う

ドリル式ホームページの作り方TOP  >>  Lesson2〜CSSを使わない装飾〜  >>  リストを使う

リストを使う

リストタグには、点付きリスト<ul></ul>と番号付きリスト<ol></ol>の二つがあります。

ともに、間に<li></li>タグを追加することで、リストの項目を増やすことができます。

<ul>
<li>点付きリスト項目1</li>
<li>点付きリスト項目2</li>
</ul>

<ol>
<li>番号付きリスト項目1</li>
<li>番号付きリスト項目2</li>
</ol>

この点付きリストを使ってサンプルに項目を追加してみましょう。

<html>
<head>
<title>ホームページ作成講座</title>
<meta http-equiv="Content-Type" content="text/html;charset=shift_jis">
</head>
<body>
<h1><img src="gif/1.gif" alt="ホームページ作成講座" /></h1>
<p><img src="gif/2.gif" alt="境界線" /></p>
<h2>Lesson1:メモ帳を起動してみよう!</h2>
<ul>
<li>ホームページを作成するためにはエディタと呼ばれるアプリを起動して、そこにプログラムを記述します。</li>
<li>Windowsをお使いの方は標準で付属しているエディタとして、メモ帳とwordpadがありますので、それを使うとよいでしょう。</li>
<li>さらに高性能のエディタをお求めの方は、無料ならterapad、有料なら秀丸エディタがお勧めです。</li>
</ul>
<h2>LLesson2:タグを書いてみよう!</h2>
<ul>
<li>ホームページを作るのに使用する言語はHTMLと呼ばれ、タグと呼ばれる命令を使って、色やフォントの大きさを指定することができます。
<p><img src="../jpg/1.jpg" alt="メモ帳に記述" /></p>
<h3><文字の大きさを変える></h3>
<p>文字の大きさは、font sizeタグを使用します。</p>
<h3><文字の色を変える></h3>
<p>文字の色は、colorタグを使用します。</p>
</li>
<li>ホームページ作成に使われるタグは文字の装飾だけに限らず、背景や画像、ページの骨格を指定するものもあります。</li>
</ul>
<hr />
<address>Copyright 2007@nkdesk. all right reserved.</address>
</body>
</html>

ここまでの作成経過はコチラ→サンプル(ホームページ作成講座)


Lesson2〜CSSを使わない装飾〜

  1. 素材を用意する
  2. 素材を作成する
  3. 画像を表示させてみよう
  4. リストを使う
  5. リンクを設定する
Copyright(C) ドリル式ホームページの作り方 all right reserved.