Imported Style Sheets
スタイルシートをインポートで組み込みます。
インポートとリンクは似ていますが、リンクはスタイルシートをHTMLに組み込むのに対して、 インポートは、スタイルシートを他のスタイルシートに組み込まれる。
具体的には、インポートしたスタイルが他のスタイルより優先的に適応されるいうことです。
インポートでスタイルシートは、IE6.0でも不安定のようです。
スタイルシートのインポートについて
スタイルシートのインポートは、HTMLのHEADセクション<HEAD>内のスタイルボックス内<STYLE>〜</STYLE>の中に、
インポート構文をサンプルのように書きます。
複数のスタイルシート・データをインポートすることができます。 複数のデータにインポートする場合、セレクタ名が重複しないように注意しなければなりません。
重複していた場合、指定どおりに表示しない場合があります。
また、埋め込みスタイルシートとの併用もできます。
@import url="file name.css" >
<html>
<head>
<title>Style Sheets</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
<!--
@import url="sample2.css"
<link rel="stylesheet" type="text/css" href="sample.css">
-->
</style>
</head>
<body>
・
・
・
・
</body>
</head>
</html>
スタイルデータの作成について
スタイルシートのデータの記述の仕方は、スタイルブロックと同じです。
ただし、<STYLE>から<!--と</STYLE>から-->は必要ありません。
作成は、メモ帳などテキストエディタで作り、拡張子をCSSと付けて「ファイル名.css」で保存します。
サンプルは、<P>タグをフォントサイズ12ポイントで文字の色が青、<B>タグを文字の色を青した場合です。
このファイルを、インポートしたページすべて、優先的に<P>タグの文字は12ポイントの青に、<B>タグを指定した部分はすべて青になります。
リンク同様、データの<P>のフォントサイズを11ポイントに変更した場合、 インポートしている全ページの<P>タグのフォントサイズは11ポイントに訂正されます。
p { font-size: 12pｔ; color: blue; }
b { color: red; }
 |
 |
|---|
