1.页面

<div class="container">
<div class="row clearfix">
<div class="col-md-12 col-centered">
</div>
</div>
</div>

2.css

.container {
display: table;
height: 100%;
} .row {
display: table-cell;
vertical-align: middle;
} .row-centered {
text-align: center;
} .col-centered {
display: inline-block;
float: none;
text-align: left;
margin-right: -4px;
}

bootstrap居中的更多相关文章

  1. 【读书笔记《Bootstrap 实战》】4.企业网站

    上一章有对个人作品站点进行一些优化.本章,轮到我们充实这个作品站点了,补充一些项目,从而展示我们的能力.换句话说,我们要构建一个相对复杂的企业网站主页. 下面有几个成功企业的网站: □ Zappos ...

  2. 【Bootstrap】4.企业网站(待续)

    上一章有队个人站点站点进行一些优化.本章,轮到我们充实这个作品站点了,补充一些项目,从而展示我们的能力.话句话说,我们要构建一个相对复杂的企业网站主页. 下面有几个成功企业的网站: □ Zappos ...

  3. bootstrap modal垂直居中 (转)

    根据博友的经验,总结后请使用方法一就行了 一,修改bootstrap.js 源码 原来的: Modal.prototype.adjustDialog = function () { ].scrollH ...

  4. bootstrap之div居中

    bootstrap之div居中 偏移列 偏移是一个用于更专业的布局的有用功能.它们可用来给列腾出更多的空间.例如,.col-xs=* 类不支持偏移,但是它们可以简单地通过使用一个空的单元格来实现该效果 ...

  5. bootstrap轮播组件,大屏幕图片居中效果

    在慕课网学习bootstrap轮播组件的时候,了解到轮播的图片都放在了类名为item下的img中 视频中老师对图片自适应采用给图片img设置width=100%完成,然而这样自适应处理图片在不同屏幕中 ...

  6. Bootstrap模态框垂直高度居中问题

    Bootstrap对话框改变其默认宽高,高度不会自适应居中.为解决这个问题,最好的方式是能够通过css来解决,试了几种网上的方案发现都不行.然后想到可以通过js来修正,什么时候修正最好?于是想到可以注 ...

  7. Bootstrap 元素居中设置

    一.Bootstrap水平居中 1. 文本:class ="text-center" 2. 图片居中:class = "center-block" 3.其他元素 ...

  8. 解决bootstrap模态框居中问题

    完美解决办法: 在bootstrap.js或bootstrap.min.js文件中找到Modal.prototype.show方法. 在that.$element.addClass('in').att ...

  9. bootstrap当中,实现div居中

    文本内容居中:利用bootstrap自带CSS样式表当中 的   text-center 样式来实现 <div class="row form-group text-center&qu ...

随机推荐

  1. Images之multi-stage builds

    原文链接 Use multi-stage builds Multi-stage builds are a new feature requiring Docker 17.05 or higher on ...

  2. 1、Python中的正则表达式(0601)

    回顾: 1.文件对象: open('file','mode','bufsize') read,readline,readlines,write,writelines,flush,seek,tell 2 ...

  3. C语言学习之桶排序

    之前的博文写了交换(冒泡)排序.选择排序,本文就写写桶排序.不过我理解的这样不算是真正上的桶排序,我的比较简单而真正的桶排序是比较复杂的,暂且就叫桶排序吧. 桶排序在排序中应该用的不多吧,个人理解的是 ...

  4. HDU 4313 Matrix(并查集)

    http://acm.hdu.edu.cn/showproblem.php?pid=4313 题意: 给出一棵树,每条边都有权值,其中有几个点是特殊点,现在破坏边还使得这几个特殊点互相不可达,需要使得 ...

  5. Thymeleaf 模板引擎技术

    引入Thymeleaf: <!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf. ...

  6. JavaWeb 基础学习

    XMAPP是自己封装的一套 web 开发套件 —— 例如Tomcat等是用自己的,而不是使用系统中其他地方安装好了的.此外将提供的 xampp 工具解压到 D 盘根目录下.(注意 xampp 一定要解 ...

  7. 数据从mysql迁移至oracle时知识点记录(一)

    最近在做数据的迁移,再将数据从mysql迁移至oracle时,部分sql语句进行了修改,在此对部分知识点进行记录: 参考资料:https://dev.mysql.com/doc/refman/5.5/ ...

  8. 新加坡金融科技节 | 蚂蚁金服CTO程立:面向全球开放,与合作伙伴共赢

    小蚂蚁说: 11月13日,在新加坡金融科技节上,蚂蚁金服CTO程立分别从TechFin.BASIC战略.SOFAStack全栈分布式体系以及全面开放等方面讲述蚂蚁金融科技. TechFin是一种“倒立 ...

  9. Qt5标准文件对话框类

    getOpenFileName()函数返回用户选择的文件名,其函数形式如下: QString QFileDialog::getOpenFileName(QWidget *parent = Q_NULL ...

  10. 关于select的默认样式问题

    select { border: solid 1px #000; appearance:none; -moz-appearance:none; -webkit-appearance:none; pad ...