参考网址:http://www.4byte.cn/question/138712/bootstrap-how-to-center-vertical.html

部分参考自上面网页中的方法.用过bootstrap的同学知道,bootsrap2中可以使用栅格布局让div水平居中,那么如何让水平居中的div又垂直居中呢?

<div class="container">
<div class="row">
<div class="span4 offset4" style="padding:5 20 5 20;">
Some text text text text text .....
</div>
</div>

</div>

直接在css里面设置就可以实现居中,css代码:

/*web background*/
.container{
display:table;
height:100%;
} .row{
display: table-cell;
vertical-align: middle;
}

这样就实现了div的水平加垂直剧中了,完毕!

[bootstrap]bootstrap2如何引导div垂直居中的更多相关文章

  1. div垂直居中的几种方法

    CSS教程:div垂直居中的N种方法[转](原文地址:http://www.cnblogs.com/chuncn/archive/2008/10/09/1307321.html) 在说到这个问题的时候 ...

  2. div垂直居中 css div盒子上下垂直居中

    div垂直居中 css div盒子上下垂直居中,让DIV盒子在任何浏览器中任何分辨率的显示屏浏览器中处于水平居中和上下垂直居中. div垂直居中常用于单个盒子,如一个页面里只有一个登录布局,使用div ...

  3. div垂直居中的问题

    工作和面试时常常会遇到怎么设置div垂直居中与浏览器中:包括固定宽高和不固定宽高的 1.固定宽高的div垂直居中 宽高固定的div很容易设置让其垂直居中 <div class="cen ...

  4. 由12306出错想到的div垂直居中的问题

    今天想看看元旦回家还有没有余票,偷偷的打开了12306,开始查询回家的车票,结果发现,竟然查询不出来,再查直接出错了 看到这个很郁闷,很纠结,但是突然想到了最近一直想实现div垂直居中,赶紧试了一下1 ...

  5. css的div垂直居中的方法,百分比div垂直居中

    前言 我们都知道,固定高宽的div在网页中垂直居中很简单,相信大家也很容易的写出来,但是不是固定高宽的div如何垂直居中呢?我们在网页布局,特别是手机等web端网页经常是不固定高宽的div,那么这些d ...

  6. css中固定宽高div与不固定宽高div垂直居中的处理办法

    固定高宽div垂直居中 如上图,固定高宽的很简单,写法如下: position: absolute; left: 50%; top: 50%; width:200px; height:100px; m ...

  7. CSS——div垂直居中及div内文字垂直居中

    最近做demo时,经常需要div垂直居中或者让div内文字相对div垂直居中.水平居中比较简单,就不多说了,这里主要记录一下垂直居中的一些方法. 一.div垂直居中的一些方法: 1.当height.w ...

  8. css 文本和div垂直居中方法汇总

    https://blog.csdn.net/u014607184/article/details/51820508 https://blog.csdn.net/liuying1802028915/ar ...

  9. 纯css使div垂直居中,div垂直,div居中的方法

    首先编写一个简单的html代码,设置一个父div类名为boxFather,再设置一个子div类名为box1.html代码如下: <div class="boxFather"& ...

随机推荐

  1. JAVA字符串格式化-String.format()的使用

    String类的format()方法用于创建格式化的字符串以及连接多个字符串对象.熟悉C语言的同学应该记得C语言的sprintf()方法,两者有类似之处.format()方法有两种重载形式. form ...

  2. C#开发微信门户及应用(45)--微信扫码登录

    在前面随笔<C#开发微信门户及应用(41)--基于微信开放平台的扫码登录处理>介绍了基于微信开放平台接口实现的微信扫码直接登录的过程.本篇介绍对扫码登录的一些改进和处理,以便更方便应用在实 ...

  3. 1、怎样设置C#OpenFileDialog(文件选择窗体)的指定路径、文件格式等属性(设置打开默认路径、文件格式、窗体显示文本)

    C#的OpenFileDialog的常用属性设置 1.设置属性 1)设置弹出的指定路径(绝对路径.相等路径) 2)设置标题 3)设置文本格式 2.打开方式1(绝对路径) 2.1) 打开的路径

  4. Oracle取消用户连续登录失败次数限制

    当用户连续登录失败次数过多时,Oracle会锁定该用户,“FAILED_LOGIN_ATTEMPTS”用于设置最大次数,超过该值则锁定该帐号. 要取消用户连续登录失败次数的限制可以按照以下方法操作: ...

  5. java package一些试验

    目录如上图,当前目录下,b是文件夹, a是文件夹. B.java 源码如下: package b; import a.*; public class B{ public static void mai ...

  6. [moka同学笔记]关于api-ms-win-crt-runtimel1-1-0.dll缺失

    在搞mongodb时候,碰到了这个坑.[api-ms-win-crt-runtimel1-1-0.dll缺失],懵逼不知道怎么改,从同事电脑里拷贝了这个文件,也按照网上的办法改了,改了半天还是不行.最 ...

  7. android largeheap 的设定

    现在公司在做tv端的APP,我的任务是视频点播功能,在看公司原有代码的基础上看到在manifiest里面设置了largeheap,所以查阅了一下资料,作为笔记 http://blog.csdn.net ...

  8. ABP导航源码分析

    按步骤看: 1,在Global.asax中执行: base.Application_Start(sender, e); 2,在AbpWebApplication类的Application_Start( ...

  9. 彻底解决mysql中文乱码的办法 ???

      MySQL会出现中文乱码的原因不外乎下列几点:1.server本身设定问题,例如还停留在latin12.table的语系设定问题(包含character与collation)3.客户端程式(例如p ...

  10. ArcGIS 的 Oracle 数据库的要求

    [ArcGIS必打补丁]ArcGIS 10.2.2 for Desktop连接Oracle(2014年10月发布)数据库崩溃的问题 http://blog.csdn.net/linghe301/art ...