margin外边距问题
1 、上下边距会叠加
!DOCTYPE html>
<html>
<head>
<m<etacharset="UTF-8">
<title></title>
<style>
.box1{
width:500px;
height:300px;
background: blue;
margin-bottom:30px;
}
.box2{
width:300px;
height:100px;
background:#ffff00;
margin-top:30px;
}
</style>
</head>
<body>
<divclass="box1"></div>
<divclass="box2"></div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<metacharset="UTF-8">
<title></title>
<style>
.box1{
width:500px;
height:300px;
background: blue;
}
.box2{
width:300px;
height:100px;
background:#ffff00;
margin-top:30px;
}
</style>
</head>
<body>
<divclass="box1">
<divclass="box2"></div>
</div>
</body>
</html>
margin外边距问题的更多相关文章
- 为什么margin-top不是作用于父元素【margin外边距合并问题】
coding时发现margin-top居然没作用于本元素上,而是作用到了父元素上. 原来是margin外边距合并导致的.以下是网上搬运来的知识: margin外边距合并详解:外边距合并现象在网页布局中 ...
- CSS Margin(外边距)
CSS Margin(外边距)属性定义元素周围的空间. Margin margin清除周围的元素(外边框)的区域.margin没有背景颜色,是完全透明的 margin可以单独改变元素的上,下,左,右边 ...
- CSS3——盒子模型 border(边框) 轮廓(outline)属性 margin外边距 padding填充
盒子模型 包括——边距,边框,填充,和实际内容 Margin(外边距) - 清除边框外的区域,外边距是透明的. Border(边框) - 围绕在内边距和内容外的边框. Padding(内边距) - 清 ...
- CSS：CSS margin(外边距)
ylbtech-CSS:CSS margin(外边距) 1.返回顶部 1. CSS margin(外边距) CSS margin(外边距)属性定义元素周围的空间. margin margin 清除周围 ...
- 关于margin外边距合并的问题
一 .兄弟元素margin外边距合并演示 当两个垂直方向相邻的兄弟元素都为常规流块盒,他们之间垂直方向的外边距不是两者之和,而是取两者中的最大值.这种现象被称为相邻的兄弟元素垂直方向外边距合并. ...
- padding(内边距)、margin(外边距)、border(边框)
元素的 padding 控制元素内容 content和元素边框 border 之间的距离. 元素的外边距 margin 控制元素边框 border 和元素实际所占空间的距离,如果你将一个元素的 mar ...
- margin外边距属性
外边距属性: 设置元素与元素之间的距离(外边距),4个方向(上右下左). margin:长度值|百分比|auto margin-top margin-right margin-bottom margi ...
- CSS margin 外边距 属性的位置关系
padding:内边距 margin :外边距 margin:10px; 所有 4 个外边距都是 10px ******************************************* ma ...
- Margin外边距叠加
外边距(Margin)叠加 只有普通文档流中块级元素(块框)的垂直外边距才会发生外边距叠加.行内框.浮动框和绝对定位框之间的外边距不会叠加 两个相邻兄弟块框 父元素与子元素,并 父元素没有内边距或边框 ...
- android 国际化 横屏（land） 竖屏（port）margin外边距和padding内边距
android 国际化 横屏(land) 竖屏(port) 边距又分为内边距和外边距,即margin和padding.
随机推荐
- 差分【bzoj3043】IncDec Sequence
Description 给定一个长度为n的数列{a1,a2...an},每次可以选择一个区间[l,r],使这个区间内的数都加一或者都减一. 问至少需要多少次操作才能使数列中的所有数都一样,并求出在保证 ...
- Linux命令之find（二）
接上一篇Linux命令之find(一) (1).实例 1.列出当前目录下及子目录下所有的.txt文件 [xf@xuexi ~]$ ls 1.txt 3.txt b.txt 公共 视频 文档 音乐 2. ...
- Beaglebone Black教程项目1闪烁板载LED
Beaglebone Black教程项目1闪烁板载LED 项目1闪烁板载LED 当设置完你的Beaglebone Black的时候,可能早就非常期待你的第一个项目了.下面就来满足大家的愿望,当然,这个 ...
- 【斜率优化】Average
[UVa1451]Average 算法竞赛入门经典第8章8-9 ( P243 ) 题目大意:给定一个长度为N的01串,选择一个长度至少为L的连续子串,使序列平均值最大 (N<=100001) 题 ...
- [Contest20171006]Subsequence Count
给定一个01串$S_{1\cdots n}$和$Q$个操作.操作有两种类型:1.将$[l,r]$区间的数取反(将其中的$0$变成$1$,$1$变成$0$).2.询问字符串$S$的子串$S_{l\cdo ...
- 【Manacher算法】poj3974 Palindrome
Manacher算法教程:http://blog.csdn.net/ggggiqnypgjg/article/details/6645824 模板题,Code 附带注释: #include<cs ...
- Cloud Foundry中vmc tunnel与caldecott原理
在Cloud Foundry中,用户可以vmc create-service创建一个service instance,但是常规情况下,用户不能手动地进一步对service instance进行设计.以 ...
- JavaScript 开发的45个技巧
JavaScript是一个绝冠全球的编程语言,可用于Web开发.移动应用开发(PhoneGap.Appcelerator).服务器端开发(Node.js和Wakanda)等等.JavaScript还是 ...
- TStringList的DelimitedText的空格问题
TStringList的DelimitedText的空格问题 如果DelimitedText的字符串中有空格,TStringList遇到空格会进行自动换行,而这显然不是我们想要的结果.经测试发现D7~ ...
- fmri数据分析图像格式及转换问题——基于spm讨论
1.几大常用格式 这张ppt介绍了现在常用的三种格式:dicom主要由扫描器产生,一般是一个slice一个文件:analyze 格式= .img/.hdr spm下用的最多:nifti ,由fsl & ...