9

一部のCSSルールをOpera（11）にのみ適用する方法はありますか？

4

7 に答える 7

11

私は挑戦が大好きです！
少し時間がかかりましたが、ついに見つけました。

body {background:0} /* default */
@media not screen and (1) {
body {background:red} /* OP 11 */
}
@media not screen and (orientation) {
body {background:green} /* for the earlier versions of Opera that pick the first media query's rule + chrome/safari */
}

テストされたブラウザ：

  • 赤：オペラ11
  • 緑：Opera10および10.5+WebKitブラウザー
  • なし：Opera 9.26 + Firefox 3.6 + IE9

これは、エラー処理と、 NOTがグローバル結果を否定するという事実に関連しています（WebKitブラウザーは、有効な値がないと方向を正しく評価しません）。orientationpresto 2.7でサポートされているため、2番目のメディアクエリはFALSEです。

間違った向きのハックは私には良い名前のように聞こえます。

于 2011-01-18T13:59:03.457 に答える
5

あなたがこれをしたい正当な理由はありますか？

私は常にブラウザの検出を行わないことをお勧めします。人々がそれを使用したいほとんどすべての場合、代わりに機能検出を使用することをお勧めします。必要な機能がサポートされているかどうかがわかれば、ブラウザ検出スクリプトのようにサイトを常に最新の状態に保つために常に作業しなくても、他のブラウザの新しいバージョンが追いついたときに自動的にサポートを開始します。

機能検出のために、私が提案できる最高のツールの1つは、Modernizrを使用することです。

ブラウザの検出（特にOpera11のような新しいブラウザ）については、絶対に確実なものを提案することはできません。正解はユーザーエージェントの文字列を確認することですが、ユーザーは別のブラウザをスプーフィングするために簡単に変更できます（特に、Operaユーザーは、サイトを回避しようとすることが最も多いため、多くの場合、そうです。ブラウザの検出とそれらのブロックを試みてください）

于 2011-01-10T15:13:02.727 に答える
2

次のスタイルは、実際にはOperaでのみレンダリングされます。詳細については、 Webmonkeysのブログ投稿を参照してください。

@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
    #myid { background-color: #F00; }
}

ただし、将来的には、あらゆる種類のCSSハックが機能しなくなる可能性があることに注意してください。したがって、jQuery（ jQuery.browser ）を使用してOperaにのみ動的なスタイルを追加することを強くお勧めします。

于 2011-01-17T21:05:15.657 に答える
2

http://www.headjs.com/を使用してみてください

于 2011-01-10T14:58:50.033 に答える
2

Opera 11はまだ非常に新しいので、CSSのみの方法はわかりません。

PHPなどのサーバー側言語を使用User Agentしてブラウザを検出するか、無料で入手できるJavascriptソリューションのCSSブラウザセレクタを使用できます。

上記のソリューションにはまだOpera11が含まれていないため、参照を確認してOpera11のユーザーエージェント文字列を確認しましょう。（実際には、オペラを検出する方法に関する独自の記事があります）

Opera / 9.80（Windows NT 5.1; U; en）Presto/2.7.39バージョン/11.00

上記のCSSブラウザーセレクターのJavascriptを見ると、それが読み取られてnavigator.userAgent多くのバリエーションと比較されていることがわかります。Opera11バリエーションを追加するだけで、準備が整います（または開発者が更新するまで待つ） javascript-またはさらに良いことに、スクリプトを更新して、作成者に知らせてください！）。

于 2011-01-10T14:58:59.950 に答える
2

どうぞ......

/* Opera */
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0)
{
here you can display anything you want just for opera
}
于 2011-01-17T02:52:54.330 に答える
1

疑似クラスはOperaのread-onlyシンプルなフィルターです。

#foo:read-only { overflow: auto; }
于 2013-06-12T16:32:26.500 に答える