TOP > Expression > Expression Web 2 > スタイルシート

スタイルシートのリンクの順序を変更するには

複数のCSSファイルがリンクされたWebページで、そのスタイルシートの順序を変更する方法を紹介します。

概要

スタイルシートには優先順位というものがあります。

複数のスタイルシートを組み合わせることができますが、CSSの仕様として、最後に宣言された記述が最優先されます。つまり、

  1. HTML文書内に直接指定されたスタイルシート
    例: <span style="font-size:18px; color: red">これは18ピクセルサイズの赤色文字です</span>
  2. 最後に宣言された外部スタイルシートファイル
  3. 最初に宣言された外部スタイルシートファイル
  4. HTMLファイル内のスタイルシートを使わないスタイル指定
    例: <font color="red">この文字は赤です</font>

そこで、思い通りにスタイルが適用されるように、スタイルシートのリンクの順序を変更する方法を紹介します。

操作方法

  1. スタイルシートのリンクの順序を変更したいWebページ、もしくはダイナミックWebテンプレートファイルを開きます。
  2. [書式]-[CSSスタイル]-[スタイルシートのリンクの管理]を選択します。
  3. [スタイルシートのリンク]ダイアログボックスにて、順序を変えたいスタイルシートを選択して、[上へ移動]もしくは[下へ移動]ボタンをクリックします。
    スタイルシートのリンク
  4. スタイルシートの順序の変更ができたら[OK]ボタンをクリックします。
    スタイルシートのリンクの順序が変更された

備考

ダイナミックWebテンプレートが適用されたWebページの場合は、個別にCSSファイルへのリンクの順序を変更することができません。この場合、その基となるダイナミックWebテンプレートファイル(DWTファイル)を開いて作業を行ってください。

ちなみに、CSSファイル内のCSSセレクタの順序を変更するには、[スタイルの管理]作業ウィンドウにて、マウスのドラッグ操作で行えます。

▲このページのトップへ

Contents Menu

Site Search by Google


Web サイト内
Expression Web Books
Buy at amazon.co.jp Now

Ads

Microsoft MVP

Microsoft Most Valuable Professional
Microsoft MVP - Expression Web
(April 2009 - March 2011)
/ Expression
(April 2008 - March 2009)
/ FrontPage
(April 2005 - March 2008)
MVP Profile