12

我只想澄清一件事。如果我使用"container-fluid"类,这意味着我不能在 bootstrap.css 中有这样的东西:

.container-fluid{
width: 1170px;
}

我尝试以像素为单位进行设置,但响应性质只是关闭了。在设置为 % 时,它可以工作。换句话说,我的问题是这样的:如何设置容器流体的固定宽度?或者它根本不是引导开发人员默认的意思?

我已经阅读了这个链接: Fluid or fixed grid system, in responsive design, based on Twitter Bootstrap

但根本找不到任何关于响应性质和固定宽度的信息container-fluid.

4

1 回答 1

25

设置px宽度使其静态化,您必须采用不同的技术使其响应,javascript这就是使用 % 的原因。

如果您想让容器不比1170px使用更宽

.container-fluid {
   max-width:1170px;
}

max-width 会做到这一点,所以如果用户的屏幕比1170px容器宽,那么它只会1170px变宽。这将使响应机制仍然有效。

当然,.container-fluid用作选择器会改变所有container-fluid元素的行为方式,因此请考虑为该元素添加第二个类并为其设置样式。

html

<div class="container-fluid maxWidth"></div>

css

.maxWidth {
       max-width:1170px;
}

如果您无论如何都希望容器被固定,那将使里面的内容无响应,因为它们无法判断屏幕何时改变了大小,因为容器不会改变大小。

于 2013-09-23T16:39:16.910 回答