Subject   : スタイルシートの記述ルール

カテゴリー  : Home page > スタイルシート



スタイルシートの指定方法

スタイルシートの定義の仕方は何種類かあります。

  1. リンキングスタイルシート

    外部のスタイルシートファイル(***.css)をリンクして、すべてのページに対して、このルールを適用します。 <HEAD>〜</HEAD>間に記述します。

    <LINK rel="stylesheet" type="text/css" href="ファイル名.css">

    まず最初に、適用するスタイルシートをメモ帳など記述しテキスト形式で保存します。 ファイル名の拡張子は、"css"で保存しておきます。 CSSファイルを編集するだけで、全ページの見栄えを一度に変える事ができます。
    (参考:memo.css ⇒ スタイルの記述例 の中味だけ記述します。)

  2. エンベディングスタイルシート

    1ページ単位(そのページのみ)でスタイルシートを指定したい場合に使います。 <HEAD>〜</HEAD>間にSTYLE要素を記述します。

    <STYLE type="text/css">
    <!--
    スタイルの記述例
    -->
    </STYLE>


    type="text/css"を記述する事で、CSSをサポートしないブラウザは無視するようになります。 修正は各ページ単位で行う必要があります。

  3. インラインスタイルシート

    HTML内の好きな場所にスタイルシートを記述します。開始タグに直接STYLE属性を指定する方法です。(任意の要素の属性としてスタイルを記述します)

    <H3 STYLE="color:blue">見出し3を青くします</H3>

    <P STYLE="color:blue">ここの文字を青くします。</P>


    好きな箇所だけ見栄えを変える事ができますが、修正が必要になった場合は、 これまでのHTML同様にそれぞれの適応箇所単位での修正が必要です。

    <SPAN STYLE="color:blue">〜</SPAN> を使用すると、それを指定した範囲にのみスタイルを適用させることができます。 また、<DIV>を使って、段落や章などのブロックの範囲でスタイルを 適用することもできます。
    スタイル設定の優先順位は、インラインスタイルシートが一番高くなります。

       ⇒ 簡単な使用例があります。
       ⇒ スタイルシート CSSのプロパティ
       ⇒ フォントの大きさ
       ⇒ スタイルシート

[メニューへ戻る]  [HOMEへ戻る]  [前のページに戻る]