【Bootstrapt】offset、push、pull
实现方式的区别:
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居中
<div class="container">
<h1>Hello, world!</h1>
<div class="row" >
<div class="col-md-6 col-md-offset-3" style="background-color: #dedef8;">
<p>中华民族</p>
</div>
</div>
</div>
具体查看api:https://www.runoob.com/bootstrap/bootstrap-grid-system.html
【Bootstrapt】offset、push、pull的更多相关文章
- 【Android】【录音】Android录音--AudioRecord、MediaRecorder
[Android][录音]Android录音--AudioRecord.MediaRecorder Android提供了两个API用于实现录音功能:android.media.AudioRecord. ...
- riot.js教程【三】访问DOM元素、使用jquery、mount输入参数、riotjs标签的生命周期
前文回顾 riot.js教程[二]组件撰写准则.预处理器.标签样式和装配方法 riot.js教程[一]简介 访问DOM元素 你可以通过this.refs对象访问dom元素 而且还有大量的属性简写方式可 ...
- Nginx-rtmp模块实现流媒体play、push、pull功能
官方wiki:https://github.com/arut/nginx-rtmp-module#readme Nginx rtmp 功能特点 1. 支持音视频直播 2. 支持flv/mp4视 ...
- 【Bootstrap】一个兼容IE8、谷歌等主流浏览器的受众门户式风格页面
上一次写的<[Bootstrap]一个兼容IE8.谷歌等主流浏览器的受众巨幕式风格页面>(点击打开链接) 部分老一辈的需求可能对这样的后现代的风格并不惬意, 没关系,我们全然能够改变布局 ...
- 【转】C#中的==、Equal、ReferenceEqual
[转]C#中的==.Equal.ReferenceEqual 转载自: http://www.cnblogs.com/zagelover/articles/2741409.html 1. Refere ...
- 【转】php 之 array_filter、array_walk、array_map的区别
[转]php 之 array_filter.array_walk.array_map的区别 原文:https://blog.csdn.net/csdnzhangyiwei/article/detail ...
- 【Android】自己定义View、画家(画布)Canvas与画笔Paint的应用——绘图、涂鸦板app的实现
利用一个简单的绘图app来说明安卓的图形处理类与自己定义View的应用. 例如以下图,有一个供用户自己随意绘图.涂鸦的app. 这里不做那么花俏了,仅提供黑白两色.但能够改变笔尖的粗细. 实质上这里的 ...
- 【入门】广电行业DNS、DHCP解决方案详解(三)——DNS部署架构及案
[入门]广电行业DNS.DHCP解决方案详解(三)——DNS部署架构及案 DNS系统部署架构 宽带业务DNS架构 互动业务DNS架构 案例介绍 案例一 案例二 本篇我们将先介绍DNS系统部署架构体系, ...
- 【jvm】07-偏向锁、轻量锁、重量锁到底是啥?
[jvm]07-偏向锁.轻量锁.重量锁到底是啥? 欢迎关注b站账号/公众号[六边形战士夏宁],一个要把各项指标拉满的男人.该文章已在github目录收录. 屏幕前的大帅比和大漂亮如果有帮助到你的话请顺 ...
随机推荐
- leetcode简单刷题
[python3]参数中的冒号与箭头 冒号后面是建议传入的参数类型 箭头后面是建议函数返回的类型
- springBoot01-helloworld-完成一个简单的RESTful API
1.访问http://start.spring.io/ 2.选择构建工具Maven Project.Spring Boot版本 2.0.1,以及一些工程基本信息 ,最后点击Generate Proje ...
- c# 如何获取系统管理员权限(UAC) 及判断当前是否是管理员权限
环境说明: VS2012,windows 7 亲自验证过win7 和xp ,XP直接不弹框,因为XP没有UAC控制机制 步骤1: 右键项目-->属性-->安全性-->选中[启用Cl ...
- 【SPOJ1811】Longest Common Substring(后缀自动机)
题意:给定两个仅含小写字母的字符串,求他们最长公共子串的长度 n<=250000 思路: #include<bits/stdc++.h> using namespace std; t ...
- ajax 封装(集中 认证、错误、请求loading处理)
一.为什么要对 ajax 进行封装: (在使用antd pro 开发项目时,里面默认是把请求进行了封装的,放在 utils/request.js 中.使用起来非常方便 https://pro ...
- 北风设计模式课程---20、UML类图介绍
北风设计模式课程---20.UML类图介绍 一.总结 一句话总结: 不仅要通过视频学,还要看别的博客里面的介绍,搜讲解,搜作用,搜实例 设计模式都是对生活的抽象,比如用户获得装备,我可以先装备工厂先生 ...
- Linux配置Selenium+Chrome+Python
---恢复内容开始--- 最近一个月没有更新博客了.最近都在复习LINUX与PYTHON知识.决定以后在LINUX环境下学习新知识. 包括后期的框架学习与平台知识方面. 直接记录今天下午的学习成果. ...
- python 将图片存入mongodb,读取图片,gridfs模块
导入图片引入模块,其中gridfs模块不需要单独安装,引入了pymongo即可直接引入from pymongo import MongoClientfrom gridfs import *import ...
- no sucn file or directory,scandir.......node-sass
an 解决方法 运行 npm rebuild node-sass
- java多线程学习笔记(六)
本节开始synchronized关键字的最后一部分内容: 静态同步方法synchronized方法与synchronized(class)代码块 关键字synchronized还可以用在static静 ...