HTML(Hyper Text Markup Language) 等の マークアップ系言語(文書にいわゆるタグをつけるもの)は 文書の論理的構造を記述するための言語であって、 見栄えを記述するものではありません。
しかし、WWW は 1990年の誕生後、 1993年から Mosaic (Mozilla や MSIE の前身にあたるウェブブラウザ) に よって爆発的に普及しましたが、これが逆に誤解を招きました。
このような誤解のために、
HTML が論理的構造を記述し、その見栄えを制御するものが
CSS(Cascading Style Sheet) です。
スタイルについて考えるとき、
また、ウェブコンテンツ(ウェブページの集合)はウェブブラウザで表示して 見るだけではなく、
最初は CSSを利用していないページ です。
次にCSSを利用した例 です。 ページのヘッダ部分に <link rel="stylesheet" type="text/css" href="./test.css"> を追加し、以下の内容で test.css を作成します。
H1{ color: red;
font-size: 20pt;
text-align: center;
}
H2{ color: black;
background-color: red;
}
P{ text-indent: 1em;
}
また以下のCSSを利用すると 同じペイジがこのように変わります
H1{ font-size: 1.5em;
margin: 1em 0em 1.5em 0em;
padding: 1em;
background: #ffe;
border-width: 0.5em 0em;
border-style: solid none;
border-color: #aaf;
line-height: 1;
}
H2{ font-size: 1.5em;
margin: 3em 1em 2em 1em;
border-width: 0em 0em thin 0em;
border-style: none none solid none;
}
P{ display: inline;
}
P:before { content: "▲";
}
HR{ width: 0em;
}
BODY { background: #9a7;
}
作成したウェブページはウェブサーバにそのファイルを置くことで
公開することができます。一般に ftp を用いてファイルをサーバに
転送(put)します。
本講座では ws_ftp 95 LE を利用します。
スタートメニューから「プログラム」→「ws_ftp」→「ws_ftp95 LE」と たどって ws_ftp 95 LE を起動します。
ws_ftp 95 LE が起動すると 「Session のプロパティ」のダイアログが開くので General タブの Newをクリックします。
以下のように必要な項目を設定します。
| Profile Name: | sub |
| Host Name/Address: | sub.osaka-sandai.ac.jp |
| User ID: | (s+自分の学籍番号) |
また以下のように、Advanced タブの ``Passive Transfers'' にチェックを入れておきます。
ここで、``OK'' をクリックすると、ftp サーバに接続するための パスワードの入力を求められます。 ここで入力するパスワードは演習室のコンピュータを使うために 入力したパスワードではなく、メイル用のパスワードです。
パスワードを正しく入力すると ftp サーバに接続します。
ウインドウの左側がローカル(手元のマシン)、
右側がリモート(ここではftp サーバ)です。
画面中央下の ``Auto'' にチェックを入れておきます。
ウインドウの右側で転送するファイルを選択し、中央の -->をクリックするとファイルが転送されます。
index.html と test.css を転送しましょう。