【CSS講座④】 CSSを外部ファイルにする

CSS(スタイルシート)をHTML文書内に直接記述せず、外部ファイルとして読み込む方法です。通常はこの方法でスタイルシートを読み込みます。

外部ファイルとして読み込めば、複数のHTML文書で同じスタイルを適用できるので便利です。デザインを変更したい場合も、一つの外部ファイルを編集するだけで済むので管理・更新がラクになります。

 

CSS(スタイルシート)の作成

まずは読み込むスタイルシートのファイルを作成します。
テキストファイルにCSS(スタイルシート)の部分のみを記述します。

h2 {
  font-size: 150%;
  color: red;
}
 
p {
  color: blue;
}

記述したら、拡張子「.css」として保存します。ここでは「style.css」とします。

 

HTMLにCSS(スタイルシート)を読み込む

次に、HTML文書に作成したCSS(スタイルシート)を読み込みます。
HTML文書のhead要素の中に以下の記述をします。

<link rel=”stylesheet” href=”style.css” type=”text/css” />

Copyright© 2018 おすすめ レンタルサーバーの選び方 All Rights Reserved.