lesson 6
第 6 回

第 6 回の講義メモ

3 章

3.2

blockquote 要素，q 要素，ハイパーリンクを使って情報のはしごができる．

3.3

class 属性，div 要素を使って作者独自の意味づけができる． 6 章で説明するスタイルシートと組み合わせることで，「他と区切って強調したい部分は罫線で囲んで表示する」ことなどが可能になる．詳しくは 6 章の学習中に述べる．

4 章

種々のインライン要素でフレーズに役割をもたせる方法を説明します．

4.1

em 要素は強調，strong 要素はさらに強い強調を示す．

ソース
```

重要なところ
と
さらに重要なところ
を示す．

```
表示

重要なところ と さらに重要なところ を示す．
dfn 要素は用語の初出箇所を強調するのに用いる．
abbr 要素は省略語の説明に用いる．
code, var, samp, kbd 各要素はコンピュータ関係の説明に用いる．
用意されている要素で表現できない役割を span 要素を用いて作者が定義できる．スタイルシートを利用して活用する

4.2

ins 要素で挿入の変更を示し，del 要素で削除の変更を示す．

4.3

sup 要素で上付き文字を示し，sub 要素で下付き文字を示す．
ソース
```

an+1 = an2

```
表示

a_n+1 = a_n²
hr は横罫線で区切りたいときに用いる．
br 要素は段落内で強制改行させたい場合に用いる．
pre 要素は改行や空白を見たままに表示するときに用いる．単語の間に空白を挟むことで見ためを整形しないように注意．

第 3 回ミニレポート

ミニレポート第 3 回課題を出題します．課題を良く読んで指示に従ってください．

第 6 章

HTML では情報のかたちを表現し，スタイルシートを利用して見栄えにかかわる設定を行ないます．スタイルシートの使い方，プロパティとよばれるパラメータについて解説を行ないます．

6.1

スタイルシートとは何か，また普及しているスタイルシートである CSS という言語について説明します

6.1.1

見栄えをスタイルシートで記述することにより教科書 p. 65 に述べられているメリットが得られる．特に

文書全体に一貫したコンセプトに基づくデザインを適用できる．
複数の文書のスタイルを一括管理できる．
HTML が本来の役割に徹することができる．これは作者，読者ともにメリットがある．

などが注目できる．授業時間中に授業用コンテンツを一括管理しているスタイルシートを変更することを実演する．「複数の文書のスタイルを一括管理」していることを確認すること．

6.1.2

スタイルシートは 1 つに限定されていない．本講義では広く使われているカスケーディングスタイルシート (CSS) のうち CSS1 を用います．

スタイルシートの作成

最初に例題のスタイルファイルを作成し，動作を確認しながら設定方法を説明します．

メモ帳を開き，次の例をタイプします．

h1{
     background-color: maroon;
     color: white;
     font-size: 200%;
     margin: 0;
     padding: 0.3em;
     text-align: center;
}
h2{
     border-bottom: maroon thin solid;
     margin: 1.5em 0 1em 0;
}
p{
     margin: 0 0 0 1em;
}

作成したファイルを mystyle.css というファイル名でネットワークドライブの html の直下にセーブします．

index.html にスタイルシートを適用

ネットワークドライブの index.html の </head> の直前に

<link rel="stylesheet" href="mystyle.css" type="text/css">

を挿入します．

これでネットワークドライブの index.html ファイルに自作のスタイルシートが適用されます．

WWW に公開するには変更があったファイルについてサーバへのファイル転送を行う必要がありますが，上記を行う前に自分の PC でチェックしてみましょう．ブラウザからネットワークドライブの index.html を開いて確認します．(InternetExplorer なら「ファイル」->「開く」->「参照」でネットワークドライブ内の index.html を開きます．)作成した文書が表示されるはずです．この段階では WWW 上には公開されていないことに注意してください．

第 5 回へ戻る第 7 回へ進む

上の記述は本科目の教科書である神崎正英著，ユニバーサル HTML/XHTML の内容のうち授業でポイントを置いて説明する点を山本が要約，補足したものを含みます．詳しい内容を必ず教科書で確認してください． Updated in November 14, 2003, schedule, Yamamoto Hiroshi

lesson 6 第 6 回