文档章节

关于margin-top会撑开父元素的解决办法

n
 naker
发布于 2016/12/02 15:16
字数 161
阅读 51
收藏 0

父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化。

 

解决方法
1、修改父元素的高度,增加padding-top样式模拟(padding-top:1px;常用)
2、为父元素添加overflow:hidden;样式即可(完美)
3、为父元素或者子元素声明浮动(float:left;可用)
4、为父元素添加border(border:1px solid transparent可用)
5、为父元素或者子元素声明绝对定位

本文转载自:http://www.jb51.net/css/75789.html

共有 人打赏支持
下一篇: 元素定位
n
粉丝 0
博文 4
码字总数 80
作品 0
成都
UI设计师
私信 提问
html 兼容性问题及一些处理方法(1)

兼容性问题: 计算一定要精确 要要让内容的宽度超出我们设置的宽高,在IE6下,内容会撑开设置好的宽高;; 在IE6元素浮动,如果宽度需要内容撑开,就给里面的块元素都加浮动; 在IE6,7下元素...

ShuenWang
2018/06/26
0
0
什么叫文档流,为什么清浮动,定位的规则是什么?

文档流 做网页布局的时候,有时候会对网页元素进行浮动,按照自己的需求对网页元素进行排版,元素浮动之后会脱离文档流,造成一些小麻烦,这时候就需要清除浮动,让元素按照自己需求正常排版...

默非静语
2018/07/10
0
0
CSS常见问题小技巧解决办法收集

一、常见问题 1、div标签未关闭  这是书写代码是最为常见的一种错误了。特别是记事本书写习惯的设计师,在未关闭的情况下记事本的不会提示你什么,如果是在DW中,未关闭DIV,开始的DIV会显示...

曾杨
2013/12/04
0
0
[布局概念] 关于CSS-BFC深入理解

写在前面 好记性不如烂笔头,研究了一下BFC,发现里面比较细的东西也是很多的!关于BFC,很多人可能都听说过BFC这个东西,大概知道这是个啥东西,相信很多人对此并没有一个非常细致的了解,本...

OB丶Koro1
2017/05/04
0
0
利用padding-top/padding-bottom百分比,进行占位和高度自适应

在css里面,padding-top,padding-bottom,margin-top,margin-bottom取值为百分比的时候,参照的是父元素的宽度。 比如:父元素宽度是100px, 子元素padding-top:50%,那么padding-top的实际值就...

daisy,gogogo
2018/07/21
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Navicat使用教程:使用Navicat Premium 12自动执行数据库复制(二)

下载Navicat Premium最新版本 Navicat Premium是一个可连接多种数据库的管理工具,它可以让你以单一程序同时连接到MySQL、Oracle及PostgreSQL数据库,让管理不同类型的数据库更加的方便。 与...

电池盒
29分钟前
1
0
简单聊聊Linux学习经历

学习,是我们一生中都规避不了的一个话题,人的一生中都是在不断的学习,无论是功成名就的人士,还是一无是处的小混混,始终都处在一个不断学习的环境中,只是学习的内容千差万别,有的人是为...

linux-tao
29分钟前
1
0
如何才能从程序员成长为实战型架构师?必掌握这7大实战技能经验

想成为一名架构师,但是架构师对应的技能,我应该掌握哪些啊?以及掌握的程度是什么样的?如何成为一名真正的实战性架构师? 我简要分为以下7点来谈谈,从技能的角度抛砖引玉,希望你对你架构...

mikechen优知
41分钟前
2
0
vue里实现echarts中国地图

echartsDemo.vue <template> <div> <div id="chart_example"></div> </div></template><script> // 首先要 cnpm install echarts import echarts from 'echarts' import ......

Danni3
52分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部