浏览器和设备 | Browsers and devices

浏览器和设备

了解从现代到旧的浏览器和设备，这些浏览器和设备都是由Bootstrap支持的，包括每个浏览器和设备的已知怪癖和bug

受支持的浏览器

引导程序支持最新稳定版本所有主要的浏览器和平台。在Windows上，我们支持InternetExplorer 10-11/MicrosoftEdge...

使用WebKit、Blink或Gecko的最新版本的替代浏览器，无论是直接使用还是通过平台的Web视图API，都不被明确支持。但是，在大多数情况下，引导应该在%29中显示并在这些浏览器中正确工作。下文提供了更具体的支助信息。

移动设备

一般来说，Bootstrap支持每个主要平台默认浏览器的最新版本。请注意，不支持代理浏览器（如Opera Mini，Opera Mobile的Turbo模式，UC Browser Mini，Amazon Silk）。

	Chrome	Firefox	Safari	Android Browser & WebView	Microsoft Edge
Android	Supported	Supported	N/A	Android v5.0+ supported	N/A
iOS	Supported	Supported	Supported	N/A	N/A
Windows 10 Mobile	N/A	N/A	N/A	N/A	Supported

桌面浏览器

同样，支持大多数桌面浏览器的最新版本。

	Chrome	Firefox	Internet Explorer	Microsoft Edge	Opera	Safari
Mac	Supported	Supported	N/A	N/A	Supported	Supported
Windows	Supported	Supported	Supported, IE10+	Supported	Supported	Not supported

对于Firefox，除了最新的正常稳定版本之外，我们还支持最新版本扩展支持版本%28 ESR%29火狐的版本。

非正式地说，Bootstrap应该在Chromium和Chrome(Linux)、Firefox(Linux)和InternetExplorer 9(InternetExplorer 9)中看起来和表现得足够好，尽管它们没有得到官方的支持。

有关引导程序必须解决的一些浏览器错误的列表，请参阅我们的浏览器缺陷墙...

Internet资源管理器

支持InternetExplorer 10+；IE9和down则不支持。请注意，某些CSS 3属性和HTML 5元素在IE10中不完全支持，或者需要前缀属性才能实现全部功能。参观我能用…有关CSS 3和HTML 5功能的浏览器支持的详细信息。

如果您需要IE8-9支持，请使用Bootstrap 3。它是我们代码最稳定的版本，我们的团队仍然支持它进行重要的错误修复和文档更改。然而，没有新的功能将被添加到它。

移动平台上的MODERS和DULT

溢出和滚动

在iOS和Android overflow: hidden;上对<body>元素的支持相当有限。为此，当您在任一设备的浏览器<body>中滚动浏览模式的顶部或底部时，内容将开始滚动。请参阅Chrome bug＃175502（在Chrome v40中修复）和WebKit错误＃153852。

IOS文本字段和滚动

在IOS 9.2中，如果滚动手势的初始触摸在文本的边界内，则模式是打开的。<input>或者是<textarea>，<body>模式下的内容将被滚动，而不是模式本身。见WebKit bug#153856...

Navbar下降

.dropdown-backdrop由于z索引的复杂性，该元素不会在导航中的iOS上使用。因此，要关闭导航栏中的下拉菜单，您必须直接点击下拉元素（或任何其他会在iOS中触发点击事件的元素）。

浏览器缩放

页面缩放不可避免地会在Bootstrap和其他网页中的某些组件中呈现呈现工件。根据问题，我们可能会解决它（首先搜索，然后根据需要打开问题）。但是，我们往往忽略这些，因为除了哈克式的解决方法之外，他们通常没有直接的解决方案。

粘:hover/:focus移动

即使在大多数触摸屏上都不可能真正的悬停，但大多数移动浏览器都会模仿悬停支持并使:hover“粘”。换句话说，:hover样式在点击元素之后开始应用，只有在用户点击其他元素之后才停止应用。在移动第一站点上，这种行为通常是不可取的。

虽然在默认情况下禁用了引导程序，但它包含了解决此问题的方法。通过设置$enable-hover-media-query到true从Sass编译时，Bootstrap将使用mq4-悬停禁用:hover在模拟悬停的浏览器中的样式，从而防止粘性。:hover风格。对于这个解决方法有一些警告；有关详细信息，请参阅Shim的文档。

印刷

即使在一些现代浏览器中，打印也可能很奇怪。

从Safari v8.0开始，使用固定宽度.container类会导致Safari在打印时使用异常小的字体大小。见第14868期和WebKit bug#138192更多细节。一个潜在的解决办法是以下CSS：

@media print {
  .container {
    width: auto;
  }
}

Android股票浏览器

开箱即用，Android 4.1（甚至一些更新的版本显然）随浏览器应用程序一起发布，作为首选的默认浏览器（与Chrome相对）。不幸的是，浏览器应用程序通常存在很多错误和不一致的CSS。

选择菜单

在<select>元素上，如果存在border-radius和/或border应用，Android股票浏览器将不显示侧面控件。（有关详细信息，请参阅此StackOverflow问题。）使用下面的代码片段删除违规的CSS，并<select>在Android股票浏览器中将其呈现为无风格元素。用户代理嗅探避免了对Chrome，Safari和Mozilla浏览器的干扰。

<script>
$(function () {
  var nua = navigator.userAgent
  var isAndroid = (nua.indexOf('Mozilla/5.0') > -1 && nua.indexOf('Android ') > -1 && nua.indexOf('AppleWebKit') > -1 && nua.indexOf('Chrome') === -1)
  if (isAndroid) {
    $('select.form-control').removeClass('form-control').css('width', '100%')
  }
})
</script>

想看个例子吗？看看这个JSBin演示。

验证器

为了向旧的和错误的浏览器提供最好的体验，Bootstrap使用CSS浏览器黑客在几个地方，针对特定浏览器版本的特定CSS，以解决浏览器本身的bug。可以理解，这些黑客会导致CSS验证程序抱怨它们无效。在一些地方，我们还使用了一些还没有完全标准化的尖端css特性，但这些特性纯粹用于渐进增强。

这些验证警告在实践中并不重要，因为css中的非恶意部分确实完全有效，而hacky部分不会干扰非恶意部分的正常运行，因此我们为什么故意忽略这些特定的警告。

我们的HTML文档同样具有一些微不足道的和无关紧要的HTML验证警告，因为我们在Firefox中包含了一个解决方法。