如何使CSS只看到歌剧如何使CSS只看到歌剧(How to make CSS visible onl

2019-06-14 05:00发布

站内文章 / 移动开发
34 0 0

有没有一种方法，使一些CSS规则仅可见于歌剧院（9.5 +）？

Answer 1:

这个技巧适用于在最新的Opera： 

 @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
       #id {css rule}
 }

它不触及任何其他浏览器我测试的远，但是这可能是实际数月，随着网络技术的繁荣等。



Answer 2:

在Opera 10.63的伟大工程

noindex:-o-prefocus, .class {
  color:#fff;
}


Answer 3:

纯CSS破解你可能无法安全地限制上的版本你黑客攻击（如-o-prefocus ，可以支持你的黑客停止修理东西长后， 开始打破他们 ）。 

// remember to limit maximum version, because hacking all future versions
// will eventually break the page 
if (window.opera && window.opera.version() < 10)     
{
   document.documentElement.className += ' opera9';
}

在CSS： 

.opera9 .element-to-hack { /*declarations for opera <= 9 only*/ }

但请仔细检查CSS规范首先要保证你正在黑客实际上是一个错误。 Opera 10的具有完全CSS2.1支持，并通过了所有的测试酸，所以如果事情没有出现合适的，这可能是因为其它原因（错误别的地方的代码，细节或拐角情况下，你不应该依赖等。）



Answer 4:

不要以为“检测戏”。

认为“检测不支持的功能X浏览器”。 例如，这个JavaScript语句可以检测到支持MOZ-边界半径的浏览器： 

typeof (getComputedStyle(document.body, '').MozBorderRadius)=='string'

这是相当于用于基于WebKit的浏览器（Safari浏览器，浏览器）： 

typeof (getComputedStyle(document.body, '').WebKitBorderRadius)=='string'

把一起，我们可以想出一些类似

function detectBorderRadiusSupport(){
    var styleObj;
    if( window.getComputedStyle ){
        styleObj=window.getComputedStyle(document.body, '');
    }else{
        styleObj=document.body.currentStyle;
    }
    return typeof styleObj.BorderRadius != 'undefined' || typeof styleObj.MozBorderRadius != 'undefined' || typeof styleObj.WebKitBorderRadius != 'undefined';
}

// the below must be inside code that runs when document.body exists, for example from onload/document.ready/DOMContentLoaded event or inline in body

if(!detectBorderRadiusSupport())document.body.className+=' fakeBorderRadius';

CSS： 

body.fakeBorderRadius .roundMyCorners{
    /* CSS for Opera and others to emulate rounded corners goes here, 
    typically various background-image and background-position properties */
}

警告：未经测试:-P



Answer 5:

Opera12 

@media (min-resolution: .001dpcm) {
    _:-o-prefocus, .class {
        background: red;
    };
}


Answer 6:

你可以使用Modernizr的（ http://www.modernizr.com/ ）来检测要使用的CSS功能-它适用的类名body元素，所以你可以然后据此构建你的CSS。



Answer 7:

我写了检测CSS属性支持一个jQuery $。支持扩展。

http://gist.github.com/556448

此外，我写了一个小片段，使真正的小厂商黑客： 

// Sets browser infos as html.className
var params = [];
$.each($.browser, function(k, v) {
  var pat = /^[a-z].*/i;
  if(pat.test(k)) { params.push(k); }
});
params = params.join(' ');
$('html').addClass(params);

这导致例如： 

<html lang="de" class="webkit version safari">
or
<html lang="de" class="opera version">

在样式表中使用这种方式： 

html.opera #content_lock {
  background:rgba(0,0,0,0.33);
}


Answer 8:

我能想到的唯一的办法是检查用户代理时，它的Opera浏览器只引用样式表。 由于用户代理可以用这个来搞砸可能不是100％可靠。



Answer 9:

您可以使用javascript写了<link> ，包括特定的CSS文件。 

if (navigator.userAgent.indexOf(’Opera’) != -1) {
    document.write(””);
}
else {
    document.write(””);
}

对于Opera 7，你可以这样做： 

/*Visible to only Opera*/
@media all and (min-width: 0) {
    /* css rules here */
}

然而，这是一般不好的做法基于浏览器的嗅探做造型。



Answer 10:

<链路HREF = “opera.css” 的rel = “样式表” 类型= “文本/歌剧” 媒体= “所有”/>

品尝这里



Answer 11:

<link href="opera.css" rel="stylesheet" type="text/opera" media="all" />

虽然这个解决方案是相当一个CSS黑客，也不能保证它会在Opera的未来版本中支持。 你也可以考虑使用以下方案：

@media all and (-webkit-min-device-pixel-ratio:10000),not all and (-webkit-min-device-pixel-ratio:0) {

.element{/*style for opera only*/}

}

http://bookmarks-online.net/link/1308/css-including-style-for-opera-only



Answer 12:

不以任何方式，我会建议。

检查在谷歌Javascript或PHP浏览器嗅探器。 有些人可能是这样过时的，你需要增加检测歌剧9.5+，但是。

浏览器嗅探器（用于造型）一般是不好的做法。

另外请注意，歌剧9.5+为用户提供了掩盖他们的浏览器IE作为渲染任何一种嗅探无用的选项。

编辑：正如你在另外一个答案看到，有window.opera.version() 我不知道window.opera对象所包含的信息。 但是，你应该看看，看看这个对象仍然是可用的，当有人已成立歌剧被视为IE或其他一些浏览器。



Answer 13:

@certainlyakey对我的作品真棒：

@media所有和（-webkit分钟设备像素比：10000），不是所有的和（-webkit分钟设备象素比：0）{#ID {CSS规则}}

我有一个网页的按钮，文本将不会在Opera中正确显示。 该按钮出现多次（加入购物车）。 应用此修复后，它的工作完美。



文章来源: How to make CSS visible only for Opera
标签： css opera css-hack
举报

收藏的人(0)

Ta的文章 更多文章
登录 后发表评论
0条评论
还没有人评论过~