所有浏览器的CSS设置，但不包括Chrome

我在css中有如下设置：

.row-height {
  height: 100% ;
}

我希望所有浏览器都有这个设置，但Chrome除外。 有没有办法做到这一点。

---

Kim

您不能直接在CSS中检查特定浏览器，但可以在JavaScript中的

BODY

元素上设置一个类，如下所示：

if (navigator.userAgent.match(/Chrome/))
  document.body.classList.add('chrome');

完成后，可以为特定浏览器添加CSS规则。类似于使用自动高度，而不是仅在Chrome上使用100%：

body.chrome .row-height { height: auto; } 

不用说，最好不要这样做，因为这会增加开销，并且容易以意外的方式中断。对于CSS中直接面临的特定问题，可能有不同的解决方法

---

然而，有时有必要像这样使用有针对性的CSS来解决浏览器错误，所以如果必须这样做，不要感到“不好”。

我能想到的最简单的方法是使用Javascript检测浏览器（1），如果检测到Chrome，则更改页面的CSS文件（2）。此解决方案的缺点是，您必须维护两个几乎相同的CSS文件，这在开发过程中可能会比较麻烦

因此，您的代码可能如下所示：

<link id="styleSheet" rel='stylesheet' href='style.css' type='text/css' media='all' />
<script>
var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
var isChrome = !!window.chrome && !isOpera;
if(isChrome) {
     document.getElementById('styleSheet').href = "styleForChromeOnly.css";
}
</script>

var isOpera=！！window.opera | | navigator.userAgent.indexOf（'OPR/'）>=0；
var isChrome=！！window.chrome&！等轴虫；
if（变色）{
document.getElementById（'styleSheet'）.href=“styleForChromeOnly.css”；
}

或者，如果您不希望在代码中使用一次性变量，或者您喜欢意大利面条：

<link id="styleSheet" rel='stylesheet' href='style.css' type='text/css' media='all' />
<script>
if(!!window.chrome && !window.opera && navigator.userAgent.indexOf(' OPR/') >= 0) {
     document.getElementById('styleSheet').href = "styleForChromeOnly.css";
}
</script>

if（！！window.chrome&&！window.opera&&navigator.userAgent.indexOf（'OPR/'）>=0）{
document.getElementById（'styleSheet'）.href=“styleForChromeOnly.css”；
}

---

(一)

(二)