※入門講座で学習したプロパティです。これ以外は、市販のリファレンスを参照下さい。m(__)m
※管理人自身が必要となって新しいプロパティを調べた場合、追加になることも・・・・あります/^^;
1.スタイルシートって?
webページと連動させて効果をなす、いわば装飾の司令塔。
何パージあろうと、htmlから同一スタイルシートを読み込ませれば、統一性のあるサイト(コーナー)ができる。
また、リニューアルなど、スタイルシートを変更すれば一発で完了!というすぐれもの!
2.スタイルシートの読み込み(リンク)方法
Webページをhtmlモードで表示させ、上からあるタグの<head>と</head>を見つけてその間に下記表のタグを記述する。
<link rel="stylesheet" type="text/css" href="スタイルシート名"> |
3.スタイルシートの記述スタイル
タグ名 { プロパティ(設定内容) } |
●全て半角英数で記述。
●ここで言うタグ名とは、Webページをhtmlモードで見てみると記事内容を挟んでいるページ構成には必要不可欠なもの。
始まりが<>、終わりを</>で締めくくっているもの。
例:
h1、h2、table、p、他いろいろ
記述例:
h2 { color: green; } |
指定するタグ名 ここから プロパティ(指定する内容) ここまで |
●五味教授式、CSS記述方式の覚え方 { }内の書き方 「プロパティ」:(は) 「指定内容(色やサイズなど)」;(です) ※「は」のコロンや 「です」に当たるセミコロンも忘れずに書くんぢゃぞ。 |
●スタイルシートファイルの保存は、○○.cssで保存する(半角英数で)
4.タグは透明な箱?
※マージン、パディングは、それぞれ四隅(left、right、top、bottom) |
タグは全て透明な箱と考えるといいかも。<黒い枠線
マージンでそのタグの中身(文字や画像)までの余白を取り、その中身を取り囲む線、線から中身までの余白。
どのタグにも共通している設定項目なので、それを頭に置いて、プロパティ設定すると考えやすいかも。
もちろん、不必要な場合は設定しなくても良い。