スタイルシートの仕組み2

今回はスタイルシートの作り方について説明します。
ファイルの形式とか、読み込ませ方を覚えましょう。

スタイルシートを作成する

スタイルシートの書き方が分かったところで、作り方を覚えましょう。作り方は3種類ありますが、今回は2つを紹介します。

１：ひとつのファイルとして作る

最初に、１つのファイルとしてスタイルシートを作成し、
HTMLに読み込ませることで、使えるようになるタイプを紹介します。
これは外部スタイルシートといい、スタイルシートのメリットを最大限に活かせるので、
基本的にはこのやり方をお勧めします。
作り方はメモ帳やHTMLエディタでスタイルシートを書いて、
拡張子をcssにして保存すれば出来上がりです。
style.cssとかtop-style.cssなど使うページに合わせた名前をつけると後で楽です。
この場合スタイルシートを書いても、HTMLで読み込む設定をしなければ利用することができません。
読み込むためにはHEADタグ内に

と書きます。これで使えるようになります。
複数のスタイルシートを読み込ませたい場合は、アドレス部分を変えて、ソースを追加してください。
何枚でも読み込めますが、3枚以下に抑えたほうが良いでしょう。

２：HTMLファイルに埋め込む

HTMLファイルに、スタイルシートも一緒に書き込んでしまう方法です。
使いたいスタイルが少ないときや、
そのページでしか使わないようなスタイルを作るときに使用します。
タグ屋さんなどで配布しているスタイルシートはこのタイプがほとんどです。
あまり多用すると、ファイルが重たくなってしまうので、気をつけましょう。
使い方は、HEADタグ内に

と書きます。

今回はスタイルシートの作り方を説明しました。
もう1つあるのですが、覚えるだけ無駄なのでやりません。
覚えたとしても使うことは無いでしょう。
次回はプロパティの紹介をします。

←前へ　：　次へ→

一覧へ戻る