在HTML中检测Chrome浏览器 [英] Detect Chrome browser in HTML

问题描述

我如何检测Google Chrome浏览器？
例如，我可以使用此标记检测Internet Explorer：

 <！ -  [if lte IE] > 
< link href =ie_only.css =stylesheettype =text / css/> 
<！[endif]  - > 
  

我有一个想法：

  var is_chrome = navigator.userAgent.toLowerCase（）。indexOf（'chrome'）> -1; 
  

但是也许有人有更好的解决方案？

更新：
我的页面只显示Chrome浏览器错误，所以我需要加载（仅用于chrome）特殊的css文件，更新

解决方案

如上面的评论中所述，您应该检测功能兼容性，而不是浏览器。也就是说，在您需要在CSS中定位WebKit浏览器的情况很少见。例如，我有一个小的字体大小/渲染问题，只在Chrome / Safari中出现，我用类似这样的方式修复它：

  @media屏幕和（-webkit-min-device-pixel-ratio：0）{
 / *特定于Chrome和Safari的CSS * / 
} 
  

另一个警告：如果Chrome / Safari中的某些内容呈现不正确，但不是Firefox中的内容，那么您很可能会遇到其他潜在问题，例如无效的标记。请确保验证您的HTML并在使用上述（稍微黑客）方法之前检查其他问题。

How can I detect the Google Chrome browser? For example, I can detect Internet Explorer with this tag:

<!--[if lte IE]>
<link href="ie_only.css" rel="stylesheet" type="text/css" />
<![endif]-->

I have one idea:

var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;

But maybe somebody has a better solution?

Update: My page shows wrong only with Chrome browser, so i need load (only with chrome) special css file with updates

解决方案

As mentioned in the comments above, you should be detecting feature compatibility, not browsers. That said, there are rare occasions when you need to target WebKit browsers in your CSS. For example, I had a minor font size/rendering issue that only appeared in Chrome/Safari, and I fixed it with something like this:

@media screen and (-webkit-min-device-pixel-ratio:0) {
  /* Chrome- and Safari-specific CSS here*/
}

Another warning: If something renders incorrectly in Chrome/Safari but not in Firefox, there's a good chance you have some other underlying issue, e.g. invalid markup. Be sure to validate your HTML and check for other problems before using the (slightly hackish) method above.

这篇关于在HTML中检测Chrome浏览器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！