CSS学习笔记-margin,padding(八)
来源:互联网 发布:c语言公开课 编辑:程序博客网 时间:2024/05/23 16:04
CSS属性——内外边距
属性 值 含义
padding padding:5px 0px 5px 0px; 同时设置四个内边距,顺序:上右下左
padding-top 上填充距离
padding-right 右填充距离
padding-bottom 下填充距离
padding-left 左填充距离
margin margin:5px 0px 0px 0px;
margin:5px 10px 8px;(左右10px)
margin:5px 0px; (上下5px,左右0px) 同时设置四个外边距,顺序:上右下左
margin-top 上边 距
margin-right 右边距
margin-bottom 下边距
margin-left 左边距
外边距合并的问题
外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。
合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。
情况一:当一个元素出现在另一个元素上面时,第一个元素的下外边距与第二个元素的上外边距会发生合并。请看下图:
当一个元素包含在另一个元素中时(假设没有内边距或边框把外边距分隔开),它们的两个上和下外边距也会发生合并。请看下图:
注释:只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。
<style type=“text/css”>body{padding:0px;background-color:#ccc;margin:0px;}.div1{width:400px;height:120px;margin:10px auto;background-color:#f00;}.div2{width:360px;height:100px;margin:20px 20px;background-color:#00f;}</style><div class="div1"> <div class="div2"></div></div>
0 0
- CSS学习笔记-margin,padding(八)
- div+css学习笔记 import padding margin
- CSS中margin和padding 的理解--学习笔记
- 学习笔记之CSS padding margin border属性详解
- CSS笔记:简析margin,padding,border
- CSS学习之道:margin和padding
- CSS: margin,padding详解
- css padding margin初始化
- CSS Border & Padding & Margin
- margin-padding-css
- CSS padding margin border
- css margin,padding 百分比
- CSS:Margin和Padding
- CSS 百分比 margin & padding
- CSS margin和padding
- CSS-border,padding,margin
- CSS 百分比 margin & padding
- CSS:margin,border,padding
- Leetcode-16. 3Sum Closest
- 关于全局变量,如何被多个.c文件共享问题
- 前端技术博客
- 交换排序——冒泡排序
- 【mongoDB实战】mongo对某个键添加索引
- CSS学习笔记-margin,padding(八)
- android view滑动的几种方法
- html5 新增的input元素
- Jenkins+Git+Maven+Shell+Tomcat
- kmalloc第二个参数的意义
- UVa OJ 1220 - Party at Hali-Bula
- 1 the brain and behavior
- 我的第一篇博客生涯
- PID算法的C语言实现