怎么理解负值的margin
来源:互联网 发布:网络密匙是什么 编辑:程序博客网 时间:2024/06/05 18:03
假设我们有一个div如下:
<div class="d1">Div1</div><div class="d2">Div2</div>
其css如下:
.d1{ width:100px; height:100px; background-color:#1ff; margin-bottom:50px;}.d2{ width:100px; height:100px; background-color:#f1f;}
当我们设定d1其margin-bottom为正值(50px)时,可以想象成d1向外扩张一块空白的区域(其它内容不能占据该区域),区域高度为50px,而其内容(块的大小100px*100px)保持不变。例子如下:
https://jsbin.com/bekeju/edit?html,css,output
而当我们设定d1其margin-bottom为负值(-50px)时,可以想象成d1向内(负方向)收缩一块区域(其它内容可以占据该收缩的区域),区域高度为50px,而其内容保持不变。例子如下:
https://jsbin.com/cozeju/edit?html,css,output
对于margin-left, margin-right, margin-top 来讲也是一样的。以同样的思路去理解就可以了。
0 0
- 怎么理解负值的margin
- margin负值怎么用
- 实用的margin负值
- margin负值的使用
- margin的负值
- margin负值的妙用
- html-margin负值的运用
- margin负值的布局使用
- margin-right负值的使用
- margin 负值
- margin负值
- margin负值
- Android margin的负值的使用
- Android margin的负值的使用
- 怎么优雅的理解margin与padding
- 前端开发:微吧里的各种margin负值
- margin属性的正负值确定
- margin为负值产生的影响
- IIS服务器同时设置多个网站的三种方式
- No resource found that matches the given name Theme.AppCompat.Light.*
- 此证书签发者无效
- OS视图控制对象生命周期-init、viewDidLoad、viewWillAppear、viewDidAppear、viewWillDisappear、view
- HDU 1850 Being a Good Boy in Spring Festival (Nimm Game)
- 怎么理解负值的margin
- 字符串搜索算法总结
- ObjC类与属性的copy关键字
- Storm 单机版的安装流程
- iOS开发之提交App前需要准备的材料
- C# Process运行cmd命令的异步回显
- 冒泡排序
- 安卓项目包命名规范及常见项目架构
- android手机锁屏后GPS模块发出的NMEA数据频率降低