next up previous
Next: 余裕のある人の課題 Up: 実習2: 箇条書き Previous: 実習2: 箇条書き

箇条書きのタグ

雛形が作成出来ていたら, HTMLの文書の書き方を箇条書き用のタグを用いて書きます. 箇条書き環境の指定には以下のタグを指定します. 上記のタグの開始タグと終了タグで囲まれる部分が, 箇条書き環境として指定され. 箇条書きの書く項目は, タグ<li>とタグ</li>で囲みます.

詳しい使い方の説明は, それぞれテキスト96, 101, 99ページを見て下さい. ここでは, 番号付きの箇条書きを使います.

メモ帳(notepad)を閉じてしまった人は, 「デスクトップ/RECIPE/recipe.html」(Netscapeのアイコンになっている) を右ボタンでクリックし, 表示されるメニューから 「プログラムから開く」を選び, そこからさらに「メモ帳」 を選ぶと, 目的のファイルがメモ帳で編集出来るようになります.

まず, 1行だけのリストを書いてみます. 先ほど書いたファイル「デスクトップ/RECIPE/recipe.html」 の見出しの終タグ</h2>のすぐ下の行に次のように記述します.

<ol type="I">
  <li>
    1行目に &lt !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" &gt
    を書きます
  </li><br>
</ol>
と書きます. これを保存して, Netscapeで見てみて下さい. メモ帳中の文書の中の &lt&gtは, それぞれ, <, >という表示に変わっている筈です. ここでltは less than の,gtは greater than の略です. <> を使用しないのは, これらの記号を用いると HTMLはこれらをタグの始まりあるいは終わりと解釈してしまうからです. このことに注意して, 次ページの内容を ordered list の終タグ</ol>の直前(上の内容に下から2行目の上) に挿入して下さい.

  <li>
    次に&lt html &gt,&lt head &gt,&lt body &gt などの基本タグの
    開始タグと終タグを書きます
  </li><br>
  <li> タグ&lt head &gt と &lt /head &gt の間に次の文を書きます
    <div>
      &lt meta http-equiv="Content-Type"
          content="text/html;charset=Shift_jis" &gt
    </div>
  </li><br>
  <li> 今書いた行のすぐ下に次の文を書きます
    <div>
      &lt title &gt Welcome to Xxx's home page &lt /title &gt
    </div>
  </li><br>
  <li>
    タグ&lt body &gt と &lt /body &gt の間に次のように挨拶文を書きます
    <div>
    &lt h1 &gt <br>
      ようこそ×××のホームページへ <br>
    &lt /h1 &gt
    </div>
  </li><br>
<li>
    水平線のタグは&lt hr &gtです
  </li><br>
  <li> 写真や画像の読み込みは,&lt img src="ファイル名" &gtです。
  </li><br>
  <li>
   段落はタグ,&lt p &gt,&lt /p &gt または,&lt div &gt,&lt /div &gt で挟みます。
  </li><br>
    <li>  表はタグ,&lt table &gt,&lt /table &gt で挟み,<br>
   表の各行は,&lt tr &gt,&lt /tr &gt で挟みます。<br>
   行の中の各項目は,&lt td &gt,&lt /td &gt で挟みます。
  </li><br>
  <li> 
 リンクはタグ,&lt a href="リンク先" &gt 文字列または画像の指定 &lt /a &gt とします。
  </li>
入力が終わったら保存して, Netscapeで確かめて下さい. 箇条書きが崩れていたら, 入力を間違っています. タグの文字や終了タグの位置等を確かめて 正しく表示されるように修正して下さい.
next up previous
Next: 余裕のある人の課題 Up: 実習2: 箇条書き Previous: 実習2: 箇条書き
2006-06-12