用bootstrap写了一个<div class="row">...</div>，如何让这个div在整个浏览器窗口居中？

用bootstrap写了一个
<body>
<header>...</header>
<div id="out" class="container">
<div id="in" class="row">...</div>
</div>
<footer>...</footer>
</body>
如何让id="out"的div占满除<header>和<footer>外的所有区域，并且让id="in"的div在id="out"的div里垂直居中？

举报该问题

推荐答案 2014-01-03

内容区域居中
将页面元素设置为 display: block并通过设置margin使其居中。可以作为mixin或class使用。
<div class="center-block">...</div>

温馨提示：答案为网友推荐，仅供参考

当前网址：http://66.wendadaohang.com/zd/UvD29U2p92xp2ss9Dni.html

其他回答

第1个回答 2014-01-02

可以在这个div标签里面写行内样式：<div align="center"></div>。这样它就居中了，望采纳

第2个回答推荐于2016-03-06

垂直居中？怎么个垂直居中法？是不是水平居中啊？

<body>
    <header  style="background:#f90;color:#fff;">header</header>
    <div id="out" class="container" style="background:#f00;width:100%;color:#fff;">
        <div id="in" class="row"  style="background:#600;width:80%; margin:0 auto;height:500px;color:#fff;">id="in"</div>
    </div>
    <footer  style="background:#f90;color:#fff;">footer</footer>
</body>

你试试这个，如果是垂直居中你再发个示意图看看

本回答被提问者和网友采纳

相似回答

Bootstrap框架是什么,如何用Bootstrap框架实现表单验证?答：Bootstrap是Twitter推出的一个用于前端开发的开源工具包。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。采用bootstrap框架来实现表单验证的优势有以下两点：一、它使用起来很方便。二、非常便于阅读，使代码更容易理解。下面我们通过一个使用Bootstrap框架的表单验证示例来说明具体...

如何修改bootstrap样式答：段落是排版中另一个重要元素之一。在Bootstrap中为文本设置了一个全局的文本样式（这里所说的文本是指正文文本）：1、全局文本字号为14px(font-size)。2、行高为1.42857143（line-height），大约是20px(大家看到一串的小数或许会有疑惑，其实他是通过LESS编译器计算出来的，当然Sass也有这样的功能)。3...

bootstrap 栅格div排布行间距如何调整答：你可以给容器div添加一个类目，自定义间距，又可以自定义主题时候，调整边距，还可以在样式表类名哪里修改。

bootstrap日期插件,在火狐浏览器下向前向后的箭头显示异常答：字体使用设置，修改配置的方式：1、点击“打开菜单”按钮，找到“选项”按钮；2、在展开的界面左侧找到“内容”选项卡，点击后在右侧展开界面；3、在该界面找到“字体和颜色”，在它的右下侧点击“高级”按钮；4、在弹出的界面将“允许页面选择显示...”勾选上并确认。重新回到页面并刷新后即可正常展示...

求解bootstrap 怎么布局两列或者多列表单答：bootstrap 2.3.2下，对于简单的两列式布局，创建一个 .row 容器，并在容器中加入合适数量的 .span* 列即可。由于默认是12列的栅格，所有 .span* 列所跨越的栅格数之和最多是12(或者等于其父容器的栅格数)。比如：2列的布局：<div class="row"> <div class="span4">...</div> <div ...

如何使bootstrap中的下拉菜单有动画效果答：Bootstrap下拉菜单组件使用起来非常容易，首先你需要定义一个class="dropdown"的div，然后在这个div标签中写入触发下拉框的按钮以及对应的下拉菜单，类似代码如下：<div class="dropdown"><button class="btn dropdown-toggle"data-toggle="dropdown"> 下拉按钮</button><ul class="dropdown-menu"><li...

大家正在搜

bootstrap中如何居中 bootstrap让div居中 bootstrap设置div居中 javascript class bootstrap 居中 bootstrap 内容居中 bootstrap引用css div中的class和id用法 div bootstrap右对齐