实现方式的区别:

  col-md-offset-*,是利用margin-left实现的,col-md-push-*/col-md-pull-*是利用相对定位实现的。

效果的区别:

col-md-offset-*只能向右偏移(margin-left),而push(float:right)/pull(float:left)因为是相对定位,既可以左偏移也可以右偏移

注意:

如果一行的偏移量实际的宽度综合超过12,col-md-offset会换行显示,也是因为margin,而push/pull只会一部分不可见(超出容器),因为是相对自身定位。
从功能上来看,push和pull可以用来给元素换位置,比较灵活。
 
 

col-md-offset实现div居中

  1. <div class="container">
  2. <h1>Hello, world!</h1>
  3. <div class="row" >
  4. <div class="col-md-6 col-md-offset-3" style="background-color: #dedef8;">
  5. <p>中华民族</p>
  6. </div>
  7. </div>
  8. </div>

具体查看api:https://www.runoob.com/bootstrap/bootstrap-grid-system.html

【Bootstrapt】offset、push、pull的更多相关文章

  1. 【Android】【录音】Android录音--AudioRecord、MediaRecorder

    [Android][录音]Android录音--AudioRecord.MediaRecorder Android提供了两个API用于实现录音功能:android.media.AudioRecord. ...

  2. riot.js教程【三】访问DOM元素、使用jquery、mount输入参数、riotjs标签的生命周期

    前文回顾 riot.js教程[二]组件撰写准则.预处理器.标签样式和装配方法 riot.js教程[一]简介 访问DOM元素 你可以通过this.refs对象访问dom元素 而且还有大量的属性简写方式可 ...

  3. Nginx-rtmp模块实现流媒体play、push、pull功能

    官方wiki:https://github.com/arut/nginx-rtmp-module#readme Nginx rtmp 功能特点 1.   支持音视频直播 2.   支持flv/mp4视 ...

  4. 【Bootstrap】一个兼容IE8、谷歌等主流浏览器的受众门户式风格页面

    上一次写的<[Bootstrap]一个兼容IE8.谷歌等主流浏览器的受众巨幕式风格页面>(点击打开链接) 部分老一辈的需求可能对这样的后现代的风格并不惬意, 没关系,我们全然能够改变布局 ...

  5. 【转】C#中的==、Equal、ReferenceEqual

    [转]C#中的==.Equal.ReferenceEqual 转载自: http://www.cnblogs.com/zagelover/articles/2741409.html 1. Refere ...

  6. 【转】php 之 array_filter、array_walk、array_map的区别

    [转]php 之 array_filter.array_walk.array_map的区别 原文:https://blog.csdn.net/csdnzhangyiwei/article/detail ...

  7. 【Android】自己定义View、画家(画布)Canvas与画笔Paint的应用——绘图、涂鸦板app的实现

    利用一个简单的绘图app来说明安卓的图形处理类与自己定义View的应用. 例如以下图,有一个供用户自己随意绘图.涂鸦的app. 这里不做那么花俏了,仅提供黑白两色.但能够改变笔尖的粗细. 实质上这里的 ...

  8. 【入门】广电行业DNS、DHCP解决方案详解(三)——DNS部署架构及案

    [入门]广电行业DNS.DHCP解决方案详解(三)——DNS部署架构及案 DNS系统部署架构 宽带业务DNS架构 互动业务DNS架构 案例介绍 案例一 案例二 本篇我们将先介绍DNS系统部署架构体系, ...

  9. 【jvm】07-偏向锁、轻量锁、重量锁到底是啥?

    [jvm]07-偏向锁.轻量锁.重量锁到底是啥? 欢迎关注b站账号/公众号[六边形战士夏宁],一个要把各项指标拉满的男人.该文章已在github目录收录. 屏幕前的大帅比和大漂亮如果有帮助到你的话请顺 ...

随机推荐

  1. python环境变量

    下载并升级更新pip python -m pip install -U pip 变量名:PY_HOME   变量值:python路径 path:win10加在最后(记得用;号隔开):win7加在前面记 ...

  2. 改计算机名导致 Oracle因目标主机或对象不存在

    手贱修改了计算机名, 结果导致登陆oracle数据库报如下错误,一查资料,说是修改了计算机名导致的,需要进到oracle安装目录: \oracle\product\10.2.0\db_1\NETWOR ...

  3. pyCharm和解释器下载安装

    参考:(mac) 安装流程和注意: http://blog.csdn.net/limin2928/article/details/69267184 解释器下载地址: https://www.pytho ...

  4. iis7反向代理

    很多站长通常在Linux系统下使用nginx作为前端server,通过反向代理间接访问其他webserver.那么如果用户安装的是Windows系统的话,又改如何实现反向代理的设置呢?搜索引擎大全 下 ...

  5. C#正则表达式将html代码中的所有img标签提取

    /// <summary> /// 取得HTML中所有图片的 URL. /// </summary> /// <param name="sHtmlText&qu ...

  6. window 安装iis和使用

    一.IIS安装(服务名World Wide Web Publishing Service) 实验环境:win2008R2虚拟机1.首先打开虚拟机,然后选中管理工具->服务器管理器. 2.选中角色 ...

  7. 二次封装arcgis的timeslider

    arcgis的timeslider是对dojo slider二次封装,项目需要,所有Map用统一样式的slider,所以写了一个common的dojo class,统一调用生成slider,作为对ti ...

  8. PHP缓存技术OB系统函数(总结)

    PHP缓存技术OB系统函数(总结) 一.总结 一句话总结: ob相比于php普通的文件操作多了缓存机制,所以适合做php的页面静态缓存 1.为什么php使用ob做静态文件缓存? 解决header()报 ...

  9. Where should I put <script> tags in HTML markup?

    Where should I put <script> tags in HTML markup? When embedding JavaScript in an HTML document ...

  10. xcode安装pod

    参考了: https://blog.csdn.net/AugustDY/article/details/92078639 输入 ruby -v ,查看当前电脑的ruby版本,如果已经安装了ruby环境 ...