2019年12月14日
CSSシグネチャとは、ページのbodyなどにidやclassを設定し、
CSSでページごとのスタイルの切り替えを行う手法です。
シグネチャ(signature)は直訳すると署名、サインの意味です。
最近あまりこの言葉を目にすることがなくなりました(Twitterでは1件もヒットしませんでした・・)が、
便利な手法なので紹介します。
なお、ユーザーがブラウザの「ユーザースタイルシート」を
設定できるようにする手法という意味もあるようですが、
今回は前者について紹介します。
CSSシグネチャを利用すると、トップページとカテゴリページで
一部デザインを変える、ナビゲーションデザインで閲覧中ページが分かるようする、
といったことが、ひとつのCSSで簡単にできます。
bodyなどにidやclassを設定します。
CSSセレクタでスタイルを適用するページを選択します。
jQueryを利用している場合も、セレクタで適用するページを選択できます。
Movable Type のデフォルトテンプレートには、
あらかじめ下記のclassがbodyに設定されています。
XOOPSでも、テンプレート変数を利用して、
bodyにモジュール固有のidを追加することができます。
Dreamweaverで、テンプレートを利用する場合も、「属性を編集可能にする」ことで
各ページのbodyの属性を編集できるようになります。