<< CSS(スタイルシート)の書き方 style属性編 | Home | スタイルシート(CSS)の適用 ID、クラス編 >>

CSS(スタイルシート)の書き方 外部ファイル編

スタイルシートを外部ファイルにする方法は、スタイルシート記序の中で、メンテナンス性、汎用性、効率を考えると一番適した方法で、web制作でも最も利用されている方法。

まずスタイルシートを記序したファイルを準備します。

記序のしかたは、以下のような書き方で書きます(詳細は次回以降で解説します。)。

要素名{プロパティ:値;}

あるいは、すべてに適用する場合。
*(アスタリスク){プロパティ:値;}

1つの要素に複数設定する場合。
要素名{プロパティ:値; プロパティ:値; プロパティ:値;}

複数の要素にスタイルを適用する場合。
要素名,要素名,要素名{プロパティ:値; プロパティ:値;}

IDを利用する場合。
ID名{プロパティ:値; プロパティ:値; プロパティ:値;}

classを利用する場合。
class名{プロパティ:値; プロパティ:値; プロパティ:値;}

上記に従って書いたファイルを任意の名前を付け、「.css」という拡張子を付けて任意の場所に保存します。

最もスタンダードなのは、「style.css」というファイル名を付けて「css」というディレクトリーに保存します。


次にhead要素内に次のようにスタイルシートの場所を指定します。
<link rel="stylesheet" href="スタイルシートの場所" type="text/css">

XHTMLの場合。
<link rel="stylesheet" href="スタイルシートの場所" type="text/css" />

通常スタイルシートの場所には、スタイルシートの位置を相対パスで記序します。

例えばcssディレクトリにstyle.cssというスタイルシートを準備していたとすると。
<link rel="stylesheet" href="css/style.css" type="text/css">
のようになります。


*プロパティでなければいけないところを、セレクタとしていたところを修正。

Calendar

   1234
567891011
12131415161718
19202122232425
262728293031 
<< March 2017 >>

Recent Entries


Categories


Archives


Profile


Valid XHTML 1.0 Transitional

Valid CSS!

Comments

Leave Comment










Trackbacks

Trackback URL

Recent Comments

Recent Trackbacks