今回はスタイルシートのお勉強をします。
と言っても、宮長はスタイルシートがあまり好きじゃないのでほんのちょっと触るだけですが。
それに、普通のHTMLタグですら満足に扱えないのに、な～にがスタイルシートだ(笑)・・って気もする。
ってことで、ほんのさわりだけを。いつかもっと使い勝手の良い言葉になったら、その時はちゃんとお勉強してみようと思う。でも今はいいや。
スタイルシートには３つの記述方法があって、
①使いたい場所に直接書き込んでしまう
②ＨＴＭＬのヘッダーに書き込んでおく
③.htmlファイルみたいに、スタイルシートの記述を並べた.cssファイルを作って、.htmlとリンクして内容を読み込む
というようにすれば良いことを学びました。
①の方法は、
ちょっとだけ使いたい時に便利そう。でも、ひとつひとつ記述してくタイプだから、いっぱいやる時は面倒～。
②の方法は、
おおまかな設定だけをして細かい指定は
<BODY>と
</BODY>
の間に記入することができるのでわりと便利。
それに、同じような設定で一部分だけ変えたい時とかは、ちょっとだけ記述を変更して他のページにコピペして応用できるのが良いカンジ。
ただ、記述した設定を
<!-- -->
で囲まないと、未対応ブラウザではスタイルシート用のソースが見えちゃうから要注意。
③の方法は、
例えばこの研究室みたいに、同じようなレイアウトのページがたくさんある場合にとっても便利。
ひとつの.cssファイルからそれぞれ読み込むだけだから、１回作っちゃえば後は使いたい放題♪読み込みかたは、HTMLのヘッダの中に
<LINK REL=STYLESHEET HREF="☆.css" TYPE="text/css">
と記入するだけ。（☆＝ファイル名）
そこいらのサイトでよく目にする「何故スタイルシートなのか」とかそんなカンジの薀蓄を思い出すと、この方法が1番意義的な使い方なんじゃないかと思うけど・・どうなんだろう？（気のせい？）
ちなみにこのページは、③の方法で作っています。ごく簡単に(笑)
で。詳しい記述の仕方ですが・・。
それを始めてしまうと、延々とキリがないので基本だけ。
基本は {PROPERTY:VALUE}
PROPERTY＝定義するもの、VALUE＝それに対する値
ということらしい。
例えば、テキストの色を指定したい時は・・・
{COLOR:#000000} って感じ。
↑の前に具体的なタグ名をつけたりして使う。
あと、{}の中に記入するものが複数あるときは、;で区切って記入する。
（区切らなくていい方法もある）
ってことで基本の基本だけ学びましたが。
結論から言うと、やっぱあんま好きじゃないな(笑)＠再確認
よくわかってないせいなんだとは思うけど、な～んか使い勝手悪い。ＩＥではできるのにネスケじゃできないこと多いし・・・結局普通にタグ打った方が早くて確実だと思いながら作業していました。
でも、背景や見出し、文字列の幅とかの設定は使えそうだから使っちゃおうかなと思ったり。ついでにどうせだから今までのぶんも全部統一して変更しちゃおうかな・・今度。
|
|