スタイルシート…。これがけっこう難関かもしれません。ですが、一度理解してしまえばカンタン。こんな便利なものはないですよ！
ですが、全て理解してから使うのは大変だと思います。次のページの「スタイルシートを使う」にいきなり挑戦してもかまいません。
■スタイルシートってなんだ？
ホームページはどんどん進歩しており、様々なデザインやサービスが生まれてきました。ですが、ホームページが生まれた当時はとても単純なもので、背景は１色、内容は文字だけというホームページもざらにありました。
これがどんどん進化し、内容も複雑になってきたわけです。そうなるとデザインを表現するための方法も多様になってきたため、読み物としての設定事項とデザイン（レイアウト）を分けようということになったようです。
つまりスタイルシートとはいろいろなデザインをするための方法だというふうに思えばわかりやすいと思います。
■何ができるのか？
実際スタイルシートを使えるようになると、超便利なことに気づきます。ちょっとしたレイアウトの調整からデザインの骨組み作り、またページのメンテナンスなどなど、すぐれものなんです。
■どうやって使うのか？
これがちょっと複雑。使い方が１つならわかりやすいのですが、スタイルシートを使うには何通りかの使い方があります。分類して挙げてみます。
●１つのページの中にスタイル設定する
●ページの外にスタイル設定して、読み込んで使う
まず大きく違うのは、この２点。普通に考えれば１つ目の「１つのページの中に設定する」は難しくありません。そのページで使いたいデザインを、そのページの中に設定するわけです。規模の小さいホームページならこれで特に問題はないと思うので、こちらを使う時もあります。
ですが問題なのは、規模の大きいホームページ（特に、ページ数の多いホームページ）の時。実際自分でホームページを管理するようになるとわかると思いますが、あとから「文章と枠の間にもう少しスペースを空けたいな」なんてことはよくあること。だけどすでに10ページくらい作ってしまっている……。全部修正するのはメンドくさい〜〜〜っ！ということになりませんか？
そんなとき役に立つのが「ページの外に設定して、読み込んで使う」という使い方なんです。
ここまではどうやって使うか、ということ。これにプラスして、どこに使うか、という設定があります。内容は、
●決まった項目（文字・テーブル・リンク などなど）に一括してスタイル設定する
*これを理解するにはhtmlのタグをある程度知っていないとわかりづらいかもしれませんが、タグの種類ごと（文字・テーブル・リンクなど）にスタイルを設定します。例えば文字はfontタグで設定しますが、そのfontタグを使っている場所に全てスタイルが設定されます。基本的なデザインのベースを設定するのに向いています。
●スタイル設定した内容を、自分が指定した場所に使う
*例えば、文字を青にする設定をしておきます。その設定に名前をつけ、文字を青にしたい場所にその名前を関連付ければ、複数の場所の文字を青にすることができます。設定は１つのため、その設定を変更（例えば緑に）すれば、すべての場所の青い文字が緑に変更されます。
●指定した場所にスタイル設定する
*指定した場所のみにスタイルを設定します。その場所のみに指定されるため、他では使わないその場所だけの微調整などに向いています。
最初に書いたように、全てを理解しなくてもスタイルシートは使えます。次ページの「スタイルシートを使う」で実際に使ってみてから少しずつ理解していきましょう。
|
