5月の授業日記


リンクのページ


5/7 属性

属性(タグのオプション)

属性をつけることで同じタグでも様々な表現にすることができる

<タグ 属性="属性値">

タグ名と区別するために半角スペースを入れる
""を閉じ忘れるとおかしくなるので必ず先に閉じる

align属性(left/center/right)

段落の水平そろえを指定する属性

bodyタグの属性

bodyタグに属性をつけるとページ全体にわたる指定ができる

色の指定

色の指定にはカラーコード(P234)カラーネームを属性値として記述

bgcolor

背景色

text

文字色

複数の属性の指定

属性を複数指定する場合、間を半角スペースで明示する

FONTタグ

文章の構造とは関係なく文字に修飾を行うために追加された
しかし修飾は新たにできたスタイルシート、タグは構造定義と役割分担されたため非推奨化

size="1-7"

文字の大きさを変える(デフォルト=3)

color

部分的に文字の色を変える

5/14 リスト

HRの属性

size=太さ(10)
width=幅(400)
align=水平方向のそろえ(left)
color=色(#008B8B)
noshade

リストの種類

リスト(順不同リスト)<ul>〜</ul>

(Un ordered List)

番号付きリスト<ol>〜</ol>

(Ordered List)

リストの中身

<li>なかみ</li>

(List Item)

作成の方法

  1. まずolかulでリストの領域をつくる
  2. なかに入れたい項目を<li>〜</li>でくくる

リストの入れ子

リストの中にリストを作ることでインデントして階層化されたリストを作ることができる

ulのリストのマークを変える(ul/li type属性)

ulに入れるとリスト全体が、liに入れるとその項目が変わる

olリストの番号を変える(ol type属性)

<ol type="a">
  1. いっこめ
  2. にこめ
  3. さんこめ
<ol type="I">
  1. いっこめ
  2. にこめ
  3. さんこめ

OLリストの開始順を変える

<ol start="">

  1. きのう
  2. きょう
  3. あした

5/21 img

画像を貼り付ける流れ

  1. 画像の準備
    1. 気に入った画像をDLフォルダへダウンロード
    2. 使用するものだけをsite/imgフォルダへ(コピー)
    3. ファイル名を分かりやすいものに書き換える
  2. imgタグでどこにあるどの画像化を指定
  3. htmlファイルと画像ファイルの位置関係を保ちながらアップロード

<img>画像を貼り付けるタグ

<img src="画像へのパス">

パス

imgタグのalign属性

アニメgifも貼れます

ページに背景画像を設置する(bodyタグbackground属性)

<body background="画像へのパス">

この画像を背景にします