1月の授業日記

1/20 CSS2

スタイルシートの基本構成

プロパティ;値

• タグに関係なく見栄えの設定を変えられる
• プロパティと値の間はコロン｢:｣命令の区切りはセミコロン｢;｣
• HTMLと違う式なので溶け込ませる方法が3通りある

1.タグの中にstyle属性の属性値を入れる

＜タグ　style＝"プロパティコロン:値"＞

2.＜head＞に記述する

• ＜head＞に記述すればページ内を一括で指定できる
• ＜style＞タグで括る
• 何に対しての指定かを示すセレクタが必要になる

＜head＞
＜style＞
セレクタ｛
プロパティ:値；
}＜/head＞
＜/style＞

3.外部スタイルシート

• スタイルシートをhtmlとは独立したファイルで作りリンクをはる
• 外部スタイルシートを修正すればリンクされているルすべてを修正できる

外部スタイルシートファイル

＜link rel="stylesheet" type="text/css" href="スタイルシートへのパス"＞

クラスセレクタ

（タグ）クラス名{プロパティ:値;}

• タグの中の一部分だけ別扱い、 あるいはタグと関係なくスタイル指定だけ行いたい場合、 エリアに識別する名前を付けて指定することができる
• 指定したい部分にタグがない場合、 class属性をつけるために表示効果のない＜div＞タグ＜span＞タグを用いる
• CSSでクラスを指定する際にはクラスの前に.（ドット）をつける

表示効果のないタグ

＜div　class＝"クラス名"＞〜＜/div＞

行内など一部分を改行しない場合

＜span　class＝"クラス名"＞〜＜div＞

今日の一言