我正在尝试使用bootstrap 2.3.2创建一个完整的响应式Web模板。正如您完全了解bootstrap提供响应式设计和流体网格系统系统。说实话,我有点困惑吗?这些之间有什么不同?哪一个有更好的表现? 我有一些使用
的例子<div class="row-fluid">
我也可以在响应式设计格式中使用它吗?是否与简单地使用
不同 <div class="row">
由于
答案 0 :(得分:1)
虽然类似的概念,流体网格和响应有点略有不同。在最基本的术语中,流体网格会根据浏览器的宽度改变其宽度,而响应式系统会以特定的像素间隔更改宽度。您可以混合使用Fluid和Responsive,如果您想要在浏览器为中型或大型时需要3列,而在小屏幕上使用一列,并希望按比例分配列。
答案 1 :(得分:0)
流体网格意味着页面中的元素占用相同的空间百分比,而与页面的宽度无关。因此,如果页面最大化或缩小,则元素会适当缩小/增长。另一方面,响应UI指的是UI根据设备呈现不同的事实。因此,如果页面支持并使用响应式UI,则它将在手机,平板电脑和桌面上呈现不同的效果。
在您拥有的示例中,这是流体布局的示例。因此,如果缩小浏览器,页面将相应缩小。这样,页面显示所有元素,而不是启用水平和垂直滚动以查看完整页面。
如果您现在希望使设计具有响应性,则应添加类似.visible-xs,.visible-sm等类。有关响应式UI的更多示例,请参阅http://getbootstrap.com/css/#responsive-utilities