1. Home
  2. HTMLタグ
  3. ページ全般タグ
  4. 外部スタイルシートを読み込む

外部スタイルシートを読み込む


<link rel="stylesheet" type="text/css" href="">

ブラウザ
IE
Fx
Sf
Cr
O
分類
空要素
要素
link要素

link要素で、外部のスタイルシートを読み込むことができます。この要素はhead要素の中で使用します。



<link rel="stylesheet" type="text/css" href="example.css">


属性 説明
rel="" stylesheet
type="" text/css CSSMIMEタイプを指定
href="" URI 読み込むスタイルシートファイルを指定
media="" メディアタイプ 対象とするメディアの指定 (初期値は screen

外部スタイルシートファイル(CSSファイル)の拡張子は .css になります。

media属性を使用すると、そのスタイルをどのメディアに対して適用させるかを指定することができます。

この属性の値(メディアタイプ)は、カンマ( , )で区切って複数指定することが可能です。

例えば、以下のように指定した場合は、「style1.css」はコンピュータscreen)とテレビtv)で、「style2.css」はプリンタprint)で使用されることになります。

<link rel="stylesheet" type="text/css" href="style1.css" media="screen, tv">
<link rel="stylesheet" type="text/css" href="style2.css" media="print">

【外部スタイルシートファイルの内容について】

外部スタイルシートファイルの内容には、以下の記述は必要ありません。(style要素は使用しません)

<style type="text/css">
</style>

使用例


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>文書のタイトル</title>
<link rel="stylesheet" type="text/css" href="example.css">
</head>
<body>



</body>
</html>


ページ全般タグ

ページの先頭へ


inserted by FC2 system