ホームページを作る -- HTMLの例

目次

1. 段落と改行の例
   
2. 中央寄せの例
   
3. 段下げ野例
   
4. リスト（箇条書き）の例
   
5. 整形テキストの例
   
6. 画像の張り付けの例
   
7. リンクを張る例
   
8. 背景の色の例
   
9. 表を作る例
   

これは段落の例を示す文章です。ここは第一段落です。次に段落を変えるようなタグをつけました。★

これは第二段落です。★

★で段落を終了させるタグが記述されています。★

次の文章は、すべて中央寄せのタグの中にあります。

次の文章は、段下げタグをつけています。

ダーウィンの自然選択で、たとえば目や腎臓のような驚くほど複雑な構造をどう説明できるのだろうか。生物に見られるとてつもなく精密な構造は本当にランダムな進化の産物なのか。それともダーウィンも気づかなかったことが、過去四十億年のあいだに起きていたのだろうか。「複雑系」より抜粋。

★「番号付き箇条書き」の例

1. 著作物とは何か
   1. 思想または感情の表現であること。
   2. 表現に創作性があること。
   3. 外部に表現されていること。
2. 著作物の例示
   1. 小説、脚本、論文、講演その他の言語の著作物
   2. 音楽の著作物
   3. 舞踊または無言劇の著作物
   4. 絵画、版画、彫刻その他の美術の著作物

★「番号なし箇条書き」の例

• データベースとは？
  • 共用して利用できる
  • 大量のデータ
  • 格納場所
• データベースを採用した利点
  • データ独立性
  • 拡張性
  • 汎用性、多目的性
  • 小さい冗長度
  • 集中管理
  • 多様な機能

★「説明型箇条書き」の例

サザエと知り合う前のマスオとはどんな男？

磯野家と同様、人に言えない過去を持つマスオ。

サザエさんの誕生日は？

大正１１年１１月２２日、さそり座の女。

波平の通勤ルートは？

渋谷から地下鉄銀座線。通勤先は銀座の晴海通り沿い。

サザエさん一家はどの部屋の力士をひいきにしていた？

当時、重量級そろい関取が多かった高砂部屋びいき。

以下は、整形テキストのタグをつけています。

ELIZAとの会話例

 男ってみんな同じ。
   ドノヨウ二
 男って、いつもあれしろ、これしろって、うるさくてしょうがないんですもの。
   何カ特別ナ例ヲアゲテクダサイ。
 そうね。ボーイフレンドがここに来るようにって言ったの。
   ボーイフレンドガアナタヲ、ココニコサセタ。
    ……
    ……

例：ALIGNの指定をしなかった場合

例：テキストを画像の上端に合わせる

例：テキストを画像の真中に合わせる

例：テキストを画像の下に合わせる

例：画像を右寄せにして、テキストをその左側に配置する

例：画像を左寄せにして、テキストをその右側に配置する

• 同じページ内へリンクする場合

  「段落と改行の例」へのリンク

• 同じコンピュータ内の別のページへリンクする場合

  公開講座の最初のページへのリンク

• 別のWWWサーバのページへリンクする場合

  日本国立近代美術館
  まだ、画像でみれる絵が少ないけど。

  広島カープのページ
  ファン（広島市大の佐藤さん）が作った広島カープのページ

• ページの背景に色をつけた例＝＝＞ここをクリック

• ページの背景を画像にした例＝＝＞ここをクリック

• ページ全体の文字の色を赤にした例＝＝＞ここをクリック

• 背景を黒に、文字の色を白にした例＝＝＞ここをクリック

例１。もっとも簡単な表の例（線なし）

例２。もっとも簡単な表の例（線あり）

例３。項目付き表の例

例４。キャプション付きの表

江木鶴子 : egi@cs.ube-c.ac.jp