我正在使用 CSS flexbox重新构建一个站点。
在检查浏览器兼容性时，我发现所有现代浏览器都支持 flexbox，除了 Safari 8 和 IE 10 需要供应商前缀。
在检查 Google Analytics 时，我看到过去 6 个月内 96% 的网站访问者使用完全支持 flexbox 的浏览器。剩下的 4% 使用需要前缀或不提供支持的浏览器。
由于我们谈论的是 4% 的用户，而且这个数字会越来越小，（我喜欢让我的代码尽可能干净和简单），我正在考虑不使用前缀，而是要求用户升级他们的浏览器。
我如何定位旧版浏览器，以便向用户显示要求他们更新浏览器的消息？
这是我到目前为止所拥有的：
<!--[if IE]>
<div class="browserupgrade">
<p>You are using an outdated browser. Please <a href="http://browsehappy.com/">
upgrade your browser</a> to improve your experience.</p>
</div>
<![endif]-->
这个 IE 条件注释涵盖了我的 IE 版本 6、7、8 和 9。
这些访问者将收到带有下载当前浏览器链接的警报。但是，Microsoft 从 IE10 开始停止支持条件注释。
现在我需要类似的东西：
- 浏览器 10
- 野生动物园 7-8
- Opera Mini < 8
- 安卓版UC浏览器
- Android 浏览器 < 4.4
是否有一个简单的 JS/jQuery 脚本来处理这项工作？还是另一种轻量级的方法？
解决方案
感谢所有的答案。很明显，有很多方法可以解决这个问题（Modernizr、PHP、jQuery 函数、纯 Javascript、CSS、browser-update.org 等）。其中许多方法都可以完全有效地完成这项工作。
我选择了最简单的一个：CSS（信用@LGSon）。
此 CSS 基本上涵盖所有目标浏览器，但 IE <= 7 除外。
.browserupgrade { display: block; }
_:-ms-fullscreen, :root .browserupgrade { display: none; }
:-o-prefocus, .browserupgrade { display: none; }
@supports (display: flex) { .browserupgrade { display: none; }}
有关详细信息，请参阅答案。
对于那些使用 IE <= 7 的相对较少的访问者，HTML 中的条件注释：
<!--[if lte IE 7]>
<div style=" ... inline styles here ...">
browser upgrade message here
</div>
<![endif]-->