css - 桌面上的 Bootstrap 容器和容器流体

标签 css twitter-bootstrap twitter-bootstrap-3

<分区>


想改进这个问题吗? 通过 editing this post 添加细节并澄清问题.

关闭 7 年前

我在屏幕分辨率为 1366 x 768 的笔记本电脑上使用默认的 bootstrap-sass 运行我的 Web 应用程序。

  • 如果我使用 container-fluid,警报会按预期扩展以适应屏幕宽度
  • 使用容器类呈现 728 像素的宽度。

根据我的屏幕分辨率,它应该使用 1170px。请让我知道我的理解是否正确。我的 index.html

中也有这个元标记
<meta name="viewport" content="width=device-width">

Image showing the difference

最佳答案

如果您的屏幕宽度为 1366px,则 container 的宽度固定为 1140px 加上 30px (每边 15px 间距)。所以 container 的总宽度在 1200px

以上的屏幕上是 1170px

添加此元标记也可能会有所帮助

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

要了解更多相关信息,请参阅:http://getbootstrap.com/css/

关于css - 桌面上的 Bootstrap 容器和容器流体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36026737/

上一篇:html - CSS - HTML 如何将 anchor 图像获取到特定的一侧

下一篇:html - 从 % 中减去 px 的 CSS calc() 将 px 值解释为 %

相关文章:

php - CakePHP:仅将 bootstrap.css 应用于某些 View 的内容,而不是布局

javascript - 如何为 jpg 文件创建响应式视口(viewport)以供用户缩放、滚动和点击?

css - 分开两个面板并将左侧面板粘贴在左上角

html - 设置没有填充/边距的 div 宽度

css - 标题图像大小

html - Bootstrap - 页面划分

html - 如何使一些 Bootstrap 列比其他列高?

html - 两个并排的 Bootstrap 按钮

ruby-on-rails - 如何将来自 Twitter 的 Bootstrap 样式表与我在 Rails 中的现有样式表一起使用,而不会弄乱一切?

html - Bootstrap 3 - 行内底部对齐列