1 、上下边距会叠加

  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>

2、父级包含子级的时候,子级的margin-top会传递给父级,可以使用父级的padding替代自己的margin。
  1. <!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>

3、margin左右
margin-lefta:uto     偏右
margin-right:auto       偏左
margin:auto      水平居中
 
    



margin外边距问题的更多相关文章

  1. 为什么margin-top不是作用于父元素【margin外边距合并问题】

    coding时发现margin-top居然没作用于本元素上,而是作用到了父元素上. 原来是margin外边距合并导致的.以下是网上搬运来的知识: margin外边距合并详解:外边距合并现象在网页布局中 ...

  2. CSS Margin(外边距)

    CSS Margin(外边距)属性定义元素周围的空间. Margin margin清除周围的元素(外边框)的区域.margin没有背景颜色,是完全透明的 margin可以单独改变元素的上,下,左,右边 ...

  3. CSS3——盒子模型 border(边框) 轮廓(outline)属性 margin外边距 padding填充

    盒子模型 包括——边距,边框,填充,和实际内容 Margin(外边距) - 清除边框外的区域,外边距是透明的. Border(边框) - 围绕在内边距和内容外的边框. Padding(内边距) - 清 ...

  4. CSS:CSS margin(外边距)

    ylbtech-CSS:CSS margin(外边距) 1.返回顶部 1. CSS margin(外边距) CSS margin(外边距)属性定义元素周围的空间. margin margin 清除周围 ...

  5. 关于margin外边距合并的问题

    一 .兄弟元素margin外边距合并演示   当两个垂直方向相邻的兄弟元素都为常规流块盒,他们之间垂直方向的外边距不是两者之和,而是取两者中的最大值.这种现象被称为相邻的兄弟元素垂直方向外边距合并. ...

  6. padding(内边距)、margin(外边距)、border(边框)

    元素的 padding 控制元素内容 content和元素边框 border 之间的距离. 元素的外边距 margin 控制元素边框 border 和元素实际所占空间的距离,如果你将一个元素的 mar ...

  7. margin外边距属性

    外边距属性: 设置元素与元素之间的距离(外边距),4个方向(上右下左). margin:长度值|百分比|auto margin-top margin-right margin-bottom margi ...

  8. CSS margin 外边距 属性的位置关系

    padding:内边距 margin :外边距 margin:10px; 所有 4 个外边距都是 10px ******************************************* ma ...

  9. Margin外边距叠加

    外边距(Margin)叠加 只有普通文档流中块级元素(块框)的垂直外边距才会发生外边距叠加.行内框.浮动框和绝对定位框之间的外边距不会叠加 两个相邻兄弟块框 父元素与子元素,并 父元素没有内边距或边框 ...

  10. android 国际化 横屏(land) 竖屏(port)margin外边距和padding内边距

    android 国际化 横屏(land) 竖屏(port) 边距又分为内边距和外边距,即margin和padding.

随机推荐

  1. 关于Spring和SpringMVC的一点感悟

    一年前,我们项目最开始使用的SSH(spring+springmvc+hibernate),那时候项目经理搭建好了框架就交给了我们,后来在一次配置事务的过程中,出现了大名鼎鼎的no seesion. ...

  2. BZOJ 1700 [Usaco2007 Jan]Problem Solving 解题(单调DP)

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=1700 [题目大意] 共有p道题目要做,每个月收入只有n元,用于付钱做题之外的部分都会吃 ...

  3. python基础之生成器,三元表达式,列表生产式

    生成器 1.什么是生成器? 在函数内但凡出现yield关键字,再调用函数就不会执行函数体代码,会返回一个值,该值称为生成器. 生成器的本质就是迭代器. 2.为什么要用生成器? 生成器是一种自定义迭代器 ...

  4. lightoj 1052 - String Growth & uva 12045 - Fun with Strings 矩阵

    思路:很容易发现规律,数列和Fib数列一样的. 记开始的时候啊a的个数为Y,b的个数为X.建立矩阵. 代码如下: #include<iostream> #include<cstdio ...

  5. Problem A: 插入一个数到数列中

    #include<stdio.h> int main() { ]={,,,,,,,,},i,k; scanf("%d",&n); a[]=n; ;i<=; ...

  6. Problem A: 逆序输出数列

    #include<stdio.h> int main(void) { int n,i,a[100]; while(scanf("%d ",&n)!=EOF) { ...

  7. Educational Codeforces Round 8 A. Tennis Tournament 暴力

    A. Tennis Tournament 题目连接: http://www.codeforces.com/contest/628/problem/A Description A tennis tour ...

  8. Linux(CentOS)下squid代理服务器配置-五岳之巅

    squid是linux下的一款代理服务器软件,他可以共享网络 ,加快访问速度,节约通信带宽,同时防止内部主机受到攻击,限制用户访问,完善网络管理 rpm -qa|grep squidyum insta ...

  9. 《windows内核安全与驱动开发》ctrl2cap中的ObReferenceObjectByName疑问

    国内有关于windows内核驱动这块的书籍实在是甚少,不过好在<windows内核安全与驱动开发>这本书还算不错(内容方面),但是不得不说这本书在许多地方存在着一些细节上的问题.比如我今天 ...

  10. C++ Java C#泛型

    泛型概述C#中的泛型C#泛型和java泛型的比较C#泛型和C++模板的比较C#泛型中的约束 泛型概述 Bruce Eckel :您能对泛型做一个快速的介绍么? Anders Hejlsberg : 泛 ...