初心者による初心者の為のスタイルシート覚え書き

初心者による 初心者の為の スタイルシート覚え書き

ここはスタイルシートが何なのか分かりきっていない管理人が
スタイルシートを勉強しながら「こういうことか!」と分かったことを頭の中で整理する為に書いた覚え書きです。
ですので、間違った解釈があるかもしれない事を覚悟(!?)してお読みください。
といいましても、ここにはスタイルシートのソースの書き方は説明していません。それ以前の問題で分からなかった点を書き連ねています。

実際のスタイル設定のソースはWeb Frontierさんの「スタイルシートの技」を参考にされるととても分かり易いです。
タグの意味については超初心者のためのホームページ作成講座さんの超初心者のためのスタイルシート講座に書いてあります。

このページは練習もかねてスタイルシートを適用しています。(背景や、このテーブル、右側のスクロールバーも)
上級者の方がこれを見て「ぷぷぷ」と笑うもよし、同じ初心者さんが「そう、私もこれがわからなかったの」と
ひっそり思うもよし、ご自由にお使いください。


はじめに スタイルシート、ここが分かんない スタイルシート、作り方が分かんない 画像の設定が分かんない

めんどくさがり屋こそスタイルシートかも。〜私が勉強しはじめたきっかけ〜

HTMLでページを作る時、書式を変えたいときはその文字をタグで囲って変えます。
私は今まで1つ1つに対していちいちタグで囲っていました。
と、いってもホームページビルダー上で変更部分を反転させてボタンを押すだけだったので
さして苦にも感じていませんでした。
必要性もないのでページのソースを見ることさえもしていませんでした。
  ソースを見るには(IEの場合)→表示 > ソースで見ることが出来ます。

▲ページの最初に戻る

無駄なソースの多さにおどろいた!

1つのきっかけは2005年の2月に楽天広場(ブログ)に登録したことでした。
楽天でフリーページを作るときには文字制限があるのですが、こうした見える文字はもちろん、
ソースを含めた総文字数なのです。
楽天のフリーページにホームページビルダーで作ったファイルをコピー(<body></body>タグ内だけをコピペします)
する時になって私は何度もこの文字制限にひっかかりました。それはそんなに文字数が多くなかったページもでした。

何故だろう?と制限にひっかかったページのソースを初めて覗いてみてビックリ!
なんと一つの段落にフォント設定のタグが何十にも重なって書かれていたんです。
それが全部の行に渡っている訳ですからそりゃ文字数も膨大になっていた訳です。
どうしてそんなに何十にも重なっていたか?それは今までたくさんの数のページを作っていた過程で
過去のページの一部分をタグごとコピーしていたので、それが積み重なっていたんですね。

ショックを受けた私はソースをきれいに出来る方法を探し始めました。
そこで出会ったのがスタイルシートという言葉だったのです。

▲ページの最初に戻る

「スタイルシート、ここがわかんない」へ