<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*外边距*/
/*margin:检索或设置对象四边的外延边距*/
/*margin-top:检索或设置对象顶边的外延边距*/
/*margin-right:检索或设置对象右边的外延边距*/
/*margin-bottom:检索或设置对象下边的外延边距*/
/*margin-left:检索或设置对象左边的外延边距*/
/*margin:auto;*/
/*margin负值让元素位移及合并;*/
.margin{
width: 200px;
height: 200px;
background-color: bisque;
margin: auto;
}
.margin1{
width: 200px;
height: 200px;
background-color: yellowgreen;
margin: auto;
margin-top: 20px;
}
</style>
</head>
<body> <div class="margin"></div>
<div class="margin1"></div>
</body>
</html>

CSS-11-外边距的更多相关文章

  1. CSS Margin(外边距)

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

  2. CSS:CSS margin(外边距)

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

  3. 关于CSS的外边距合并问题

    首先,需要明确的是只有普通文档流中块框的垂直外边距才会发生外边距合并.行内框.浮动框或绝对定位之间的外边距不会合并. 而在普通文档流中,这又分两种情况,分别是父子元素之间和相邻元素之间. <!D ...

  4. css内外边距属性

    盒子模型: 所有HTML元素可以看作盒子,在CSS中,"box model"是用来设计和布局时 使用. CSS盒模型本质上是一个盒子, 封装周围的HTML元素, 它包括:边距,边框 ...

  5. CSS 内外边距 float positio属性

    一.外边距和内边 margin:            用于控制元素与元素之间的距离 外边距:margin的最基本用途就是控制元素周围空间的间隔,从视觉角度上达到相互隔开的目的. padding:   ...

  6. CSS 垂直外边距合并:规范、延伸、原理、解决办法

    <CSS 权威指南>第七章基本视觉格式化.p192,提到了 垂直外边距合并 的情况,解释总体算清晰,但是感觉不全且没有归纳成一条一条的,参考 CSS框模型中外边距(margin)折叠图文详 ...

  7. css的外边距合并或者外边距塌陷问题

    第一种情况: 已知两个宽和高均为100px,margin均为20px的div垂直排列,现象如下图所示: 当设置css1的margin-bottom:40px:或者css2的margin-top:40p ...

  8. css中外边距合并

    最近在布局时遇到一个有趣的问题 <style> #div1{width:200px;height:200px;background:red;}  #div2{width:50px;heig ...

  9. CSS Margin外边距合并

    应该知道这点东西的!!! 可是偏偏记不住! 外边距合并会发生在以下两种情况下: 1 垂直出现的两个拥有外边距的块级元素. div1 { margin-bottom: 20px; } div2 { ma ...

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

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

随机推荐

  1. 学习Java第四周

    复习数组,数组和方法在内存中是怎样存储这个问题,有些一知半解. 复习了面向对象思想,是面向对象思想,类的定义,对象实例化,构造函数,还有用javabean的格式定义类.面向过程是自己解决问题,面向对象 ...

  2. markdown color

    深青色 深蓝色 seagreen darkgreen indianred cornflowerblue lightskyblue coral lightcoral darkorange

  3. python字符串(str)

    # value = "raitOrEi" # v = value.capitalize()#首字母大写 # print(v) # v1 = v.casefold()#全部变小写,不 ...

  4. 第二阶段:1.流程图:12.AXURE绘制页面流程图

    注意的事项: 完整的页面流程图

  5. Excel读取方式优化(浅谈对规律的认知)

    相信大家都接触过对Excel的读取,今天突发奇想,想将自己的一小段经历分享出来.灵活识别列名并将其存到对象数组中. 固定形式的Excel列的读取: 源于我第一次操作Excel,将列名对应成table中 ...

  6. Alibaba Cloud Toolkit 使用心得(IDEA版)

    一.安装插件 确保 IntelliJ IDEA 在 2018.1 或更高版本 打开 Settings - Plugins 搜索安装 Alibaba Cloud Toolkit 二.配置环境 Deplo ...

  7. 【温故知新】Java web 开发(四)JSTL 与 JDBC 的增删改查

    本篇开始使用 jstl 这个 jsp 的标签库,在同一个 Servlet 中实现处理 CRUD 请求,以及使用 jdbc 数据库基本操作.然后你会发现 Servlet 和 jdbc 还是有很多不方便之 ...

  8. 【题解】LOJ6060 Set(线性基)

    [题解]LOJ6060 Set(线性基) orz gql 设所有数的异或和为\(S\),答案是在\(\max (x_1+S\and x_1)\)的前提下\(\min x_1\)输出\(x_1\) 转换 ...

  9. 洛谷$P4211\ [LNOI2014]\ LCA$ 树链剖分+线段树

    正解:树剖+线段树 解题报告: 传送门$QwQ$ 看到$dep[lca]$啥的就想到之前托腮腮$CSP$模拟$D1T3$的那个套路,,, 然后试下这个想法,于是$dep[lca(x,y)]=\sum_ ...

  10. 在.NET Core中批量注入Grpc服务

    GRPC 是谷歌发布的一个开源.高性能.通用RPC服务,尽管大部分 RPC 框架都使用 TCP 协议,但其实 UDP 也可以,而 gRPC 干脆就用了 HTTP2.还有就是它具有跨平台.跨语言 等特性 ...