为什么margin:0 auto不能用于inline-block元素
前言:今天一个实习生问我,为什么他对图片使用了margin:0 auto,但图片却没有居中,我让他换成对父元素使用text-align:center即可。为什么margin:0 auto对图片不起作用,这是以前入门的时候看《css权威指南》知道的,后来一直这么用,突然有点忘记为什么了。于是又去翻了下书,这里分享下自己的理解。
块级元素的水平属性
块级元素在水平方向上有7大属性,margin-left、border-left、padding-left、width、padding-right、border-right和margin-right。
- 这7大属性的值加起来必须是元素包含块的宽度(这一点记住,一会要考
为什么margin:0 auto不能用于inline-block元素的更多相关文章
- 正确的使用margin:0 auto与body{text-align:center;}实现元素居中(转)
body{text-align:center}与margin:0 auto的异同? text-align是用于设置或对象中文本的对齐方式.一般情况下我们设置文本对齐方式的时候需要用此属性进行设置 我们 ...
- 绝对定位后,position:absolute;不能使用margin: 0 auto;实现居中;
声明: web小白的笔记,欢迎大神指点!联系QQ:1522025433. 我们都知道margin: 0 auto:可也实现块状元素的水平居中:但是对于绝对顶为的元素就会失效: 请看实例: <!d ...
- margin:0 auto 与 text-align:center
1.text-align:通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式; text-align:center 设置文本或img标签等一些内联对象的居中. 2.m ...
- margin:0 auto 与 text-align:center 的区别
基本概念: 1.text-align: 属性规定元素中的文本的水平对齐方式; 该属性通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式; 一般情况下设置文本对齐方式的时使用此属性.支 ...
- margin:0 auto 与 text-align:center 的区别(转载)
摘自:http://www.cnblogs.com/zhwl/p/3529473.html 基本概念: 1.text-align: 属性规定元素中的文本的水平对齐方式; 该属性通过指定行框与哪个点 ...
- 图片margin:0 auto;为何不居中
图片margin:0 auto;为何不居中 关键: img元素 display设为block 代码: <!DOCTYPE html> <html> <head> & ...
- margin:0 auto在IE中失效的解决方案
转自:http://www.cnblogs.com/hongchenok/archive/2012/11/29/2795041.html 最近在开发项目的时候,发现在火狐浏览器中设置外容器margin ...
- css中margin:0 auto没作用
很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题!margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应!其 ...
- CSS中margin: 0 auto;样式没有生效
问题:有两个元素: A, B.两则是嵌套关系,A是B的父节点.A和B都是块元素.当在A上设置:margin: 0 auto的时候,B并没有在页面中居中. margin: 0 auto 为什么没有生效? ...
随机推荐
- SAS学习笔记23 线性回归、多元回归
线性回归 由样本资料计算的回归系数b和其他统计量一样,存在抽样误差,因此,需要对线性回归方程进行假设检验 1.方差分析 2.t检验 相关系数的假设检验 相关系数(correlation coeffic ...
- linux上启动tomcat报错:Failed to read schema document 'http://www.springframework.org/schema/data/mongo/spring-mongo-2.0.xsd
本文原文连接: http://blog.csdn.net/bluishglc/article/details/7596118 ,转载请注明出处! spring在加载xsd文件时总是先试图在本地查找xs ...
- Tokitsukaze and Strange Rectangle CodeForces - 1191F (树状数组,计数)
大意: 给定$n$个平面点, 定义集合$S(l,r,a)$表示横坐标$[l,r]$纵坐标$[a,\infty]$内的所有点. 求可以得到多少种不同的集合. 从上往下枚举底层最右侧点, 树状数组统计贡献 ...
- (一)CXF之发布第一个WebService服务
一.CXF入门 1.1 前提 Apache CXF 是一个开源的 Services 框架,CXF 帮助您利用 Frontend 编程 API 来构建和开发 Services ,像 JAX-WS .这些 ...
- pmtk3
summary A list of every PMTK3 demo auto-generated by publishDemos on 27-Mar-2012 Book Demos (1) Intr ...
- vue-cli搭建vue项目环境
该篇文章是继https://www.cnblogs.com/qing-5/p/11321585.html来写 1.打开终端,输入指令"npm install --global vue-cli ...
- JdbcTemplate批量插入数据
运行环境:SpringBoot,注入JdbcTemplate @Autowired private JdbcTemplate jdbcTemplate; 1.单表批量插入数据 @Test public ...
- 离线yum源挂载及yum服务器搭建
在进行现网环境搭建的时候,绝大多数情况下,centos或redhat(以下以centos为例)服务器是跟公网隔离的,因此需要找一台服务器挂载自己的yum源. 一.离线yum源包的制作 离线yum源可以 ...
- Java学习第一天之简单了解java语言及开发环境的安装
一.初步了解Java语言 Java语言是由Sun公司的James Gosling创造的一门面向对象的高级语言. 2009年4月20日,Sun公司被Oracle以总价值约为74亿美元的价格收购,Java ...
- Java 中的多态,一次讲个够之继承关系中的多态
多态是继封装.继承之后,面向对象的第三大特性. 现实事物经常会体现出多种形态,如学生,学生是人的一种,则一个具体的同学张三既是学生也是人,即出现两种形态. Java作为面向对象的语言,同样可以描述一个 ...
- 正确的使用margin:0 auto与body{text-align:center;}实现元素居中(转)