|
CSSファイルの読み込みは
<link rel="stylesheet" href="style.css" type="text/css">
以外に
@importでCSSファイルを読み込むこともできます。
style.cssという外部ファイルに記述されているCSSをHTMLファイルに
読み込みます。
@imoprtでCSSファイルを読み込む場合、
@import url("ファイル名");
をCSSの先頭に
記述する必要があります。
style.css
p{color:green;}
HTMLソース
<HTML>
<HEAD>
<TITLE>ホームページ</TITLE>
<style type="text/css">
<!--
@import url("style.css");
-->
</style>
</HEAD>
<BODY>
<p>緑色です。</p>
</BODY>
</HTML>
■ CSSファイルに別のCSSファイルを読み込む
@importでCSSファイルに別のCSSファイルを読み込むこともできます。
これにより複数のCSSファイルを基盤となるCSSファイルに呼び込めます。
下の例では
基盤となるstyle.cssに別のCSSファイルであるstyle2.cssを読み込みます。
style.css
p{color:green;}
style2.css
p{font-size:30px;}
これをstyle.cssに追加すると
style.css
@import url("style2.css");
p{color:green;}
HTMLソース
<HTML>
<HEAD>
<TITLE>ホームページ</TITLE>
<link rel="stylesheet" href="style.css" type="text/css">
</HEAD>
<BODY>
<p>文字の色が緑色で文字のサイズが30pxになりました。</p>
</BODY>
</HTML>
■ その他の項目
・
スタイルシートの記述方法
・
スタイルシートの記述場所
・
個別にCSSを指定する
・
複数のセレクタで指定
・
外部ファイルのコメント
スタイルシート一覧のページに行く
|
