移动优先 Bootstrap

Bootstrap 在 Bootstrap 3 之后已经优先考虑移动设备了。这意味着各种设备都可找到“移动优先”样式，而不是在单独的文件中。您需要将视口元标记添加到 <head> 元素中，以确保正确渲染和在移动设备上进行触摸缩放。

<meta name = "viewport" content = "width = device-width, initial-scale = 1.0">

在此处，

  • 宽度属性控制设备的宽度。将其设置为设备宽度将确保它在各种设备（移动设备、台式机、平板电脑...）上得到适当的渲染。
  • 初始比例 = 1.0 确保当加载页面时，您的网页将以 1:1 的比例渲染，并且开箱即用不会应用任何缩放。

添加用户可缩放 = 在内容属性中禁用 no，以在移动设备上禁用缩放功能，如下所示。使用此更改，用户只能滚动而不能缩放，这能让您的网站感觉更像原生应用程序。

<meta name = "viewport" content = "width = device-width, initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no">

更新于： 2020 年 6 月 12 日

1 千次以上浏览量

职业生涯的开端

通过完成课程获得认证

开始
广告