|
CSSを全てのページに適用これまでの説明は、スタイルの定義をHTMLファイルに記述するものでしたが、スタイルの定義を別のファイル(CSSファイル)に記述しておき、Webページに適用する方法を説明します。スタイルの定義をCSSファイルに記述しておくことで、どのページにも一貫したスタイルを適用することができます。これで、かなりの手間と時間を省くことができます。
CSSファイルを読込むように設定この段階では、まだCSSファイルを作成していませんが、とりあえず、HTML側でCSSファイルを読込む設定をしておきましょう。 CSSファイルを読込むようにするには、<head>要素に、<link>タグを使用します。 sample.html
<html>
この時点では、まだCSSファイルを作成していないので、何のスタイルも適用されません。CSSファイルの作成については、次ページで説明します。 <link>タグ<link>タグは、この文書自体が他の文書とどのような関係なのかを定義します。内容を伴うことはないので、終了タグは省略形で記述しておきましょう。<link>タグには、読込むファイルを指定したりする属性が必須となります。 rel属性rel属性は、この文書自体から見て、読込む(href属性で指定された)文書がどのような関係であるのかを指定します。ここでの関係はスタイルシートなので、rel属性の値には「stylesheet」と記述します。 type属性type属性は、読込むファイルの形式(MIMEタイプ)を定義します。ここではCSSファイルなので「text/css」と記述しておけばOKです。 href属性この属性には、<a>タグのhref属性と同様、読込む(リンク先)ファイルのパスを記述します。絶対パス、相対パスのどちらでも良いです。 ここでは、「href="page_styles.css"」と記述して、同じディレクトリにあるpage_styles.cssというCSSファイルを読込むように設定しています。 まとめ
|