Operaだけに適応させたいCSSハック

Operaだけってのが見つけられなかったので、エントリーかいてみました。といっても他のCSSハックの複合技でOperaだけ普通に表示させているだけです。しかも「ほぼ」で完全にではないんです。今回やりたかったのはOpera9.x系統、firefox3.x、safari3.x、IE5.5〜6、IE7をCSSで区別したかっただけで、ネタ用なんでまじめにレイアウト調整などするなら回りくどいことしなくていいと思います。多分それ以外のブラウザを使っている人はどんなに他のブラウザ進めたって乗り換えたりしないでしょ。レイアウト崩れとかどーでもいいんでしょ。

事前準備として、HTML側の構成はOperaブラウザで閲覧すると「Operaサイコォオー」と表示され、それ以外のブラウザでは「Opera使いなさいよぉ！」と表示させることにします。

<html>
<head></head>
<body>
<div class="none">
<p>Opera使いなさいよぉ！</p>
</div><!-- opera -->
<div class="opera">
<p>Operaサイコォオオオー</p>
</div><!-- opera -->
</body>
</html>

確認としてCSSハックのおさらいです。

firefoxだけに適応するCSSハック

div.none,x:-moz-read-only {display:block !important;}

Firefox 1.0, 1.5, 3.0 用の CSS ハック
http://www.yomotsu.net/lab/css/csshack_firefox

safariだけに適応するCSSハック

@media screen and (-webkit-min-device-pixel-ratio:0){
div.none {display:block !important;}
}

Safariのこれまで使われてきたhtml[xmls*=""]ってのがうまく動いてくれなかったので、@mediaで指定してその中に記載しています。@mediaって言ってる時点でCSSハックでは無い気がしてきたぞ。同じようなことがmozilla系のブラウザでも出来たような気がします。

[CSS]Safari3.X用CSSハック
http://tenderfeel.xsrv.jp/css/91/

IE4〜6に適応するCSSハック（アンダースコアハック）

div.nonoe {_display:block !important;}

IE7に適応するCSSハック（スターハック）

*:first-child+html div.none {display:block !important;}

CSSハック | 謎解きウェブ | BLOG × WORLD ENDING
http://blog.worldending.jp/web/css-hack.php

全部まとめるとこんな形になります。

/* Opera */
.none {display:none;}                               /* デフォルトでOpera使えを非表示 */
/* firefox */
.none,x:-moz-read-only {display:block !important;}  /* Opera使えを表示       */
.opera,x:-moz-read-only{display:none;}              /* Operaサイコーを非表示 */
/* safari */
@media screen and (-webkit-min-device-pixel-ratio:0){
.none {display:block !important;}                    /* Opera使えを表示       */
.opera{display:none;}                                /* Operaサイコーを非表示 */
}
/* IE */
.none {_display:block !important;}                   /* Opera使えを表示       */
.opera {_display:none;}                              /* Operaサイコーを非表示 */
*:first-child+html .none {display:block !important;} /* Opera使えを表示       */
*:first-child+html .opera {display:none;}            /* Operaサイコーを非表示 */

完成形はこんな感じです。自分の環境では問題ありませんが、不具合があったら教えていただければと思います。
今日の結論：Opera使いなさいよぉ。

ここまで書いて、見つけちゃった。これは知らなかった・・・。Opera9.63、Opera10アルファで無事動いてました。