QR Code Business Card

IEの条件付きコメントをDreamweaverのテンプレートで使う方法!

IEの条件付きコメントをDreamweaverのテンプレートで使う方法!
 IE6,7,8などは、FirefoxやSafariなど他のブラウザとスタイルシートの違いが多くて、個別にスタイルシートのファイルを設定したい場面が多くあります。そんな時よく条件付きコメント「<!–[if lt IE 9]>○○○○<![endif]–>」を使うのですが、そのままではDreamweaverのテンプレートでは使えません。



例えば、IE6-8に専用のスタイルシートを設定したい場合、<header>〜</header>にこのように条件付きコメントを書きまよね。




普通にhtmlファイルに書くならこれで良いですが、このままDreamweaverのテンプレートに書くと、コメントアウト扱いになって無視されてしまいます。テンプレートが反映されるhtmlファイルの階層によって変更されるはずの、cssファイルへのリンクが自動で変更されません。

そこで、このようなDreamweaverのテンプレートに使う変数の書き方を利用します。



これは条件でテンプレートの表示が変更ができる便利なものですが、これで先ほどの条件付きコメントを書き直します。



このように、それぞれ「<>」を「@@(”)@@」で表示させることによって、テンプレートファイル上ではコメントではなくなりますので、cssファイルが正常に読み込まれるようになります。

そして、テンプレートが反映されるhtmlファイル上では、コメントとして出力されるようになりますので、「条件付きコメント」として機能するようになります。


顔文字みたいで笑えますが、Dreamweaverを使うときにはかなり便利なので、覚えておいて損はないですよ。

SNSでもご購読できます。

コメントを残す

*

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)