负边距

可以改变 他在文档流中的尺寸

当块级元素设置 margin： -10px; 　　这个快 的大小没变但是他的定位的位置向上串了，压住了上面的文字   而且在他后面的文字  会爬到他身上 而前面的文字  会被他 盖住

即 文档流只能向做上流　　

在文档流中 元素的最终边界 是由 margin决定的  margin为负的时候就相当于元素的边界向里收文档流只认识  这个边界  ，不管他实际的尺寸是多少  这这时文档流的 高度就减少了

图中灰色的部分 宽度是auto  下面  即继承了父级的宽度  也就是没设这  这里在设置 margin-right：-100px　　这样 内容就扩大了 超出了父级  但是父级border没有被撑开   即文档流中所占的大小没有变

负边距可以改变  元素的大小

css 负边距的更多相关文章

  1. css负边距自适应布局

    单列定宽单列自适应布局: <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> ...

  2. CSS 负边距读后感

    最近看到一篇讲解CSS 负边距的文章: http://segmentfault.com/a/1190000003750411?utm_source=Weibo&utm_medium=share ...

  3. css负边距之详解

    自从1998年CSS2作为推荐以来,表格的使用渐渐退去,成为历史.正因为此,从那以后CSS布局成为了优雅代码的代名词. 对于所有设计师使用过的CSS概念,负边距作为最少讨论到的定位方式要记上一功.这就 ...

  4. css 负边距 小记

    水平格式化 当我们在元素上设置width的时候,影响的是内容区的宽度  但是当我们又为元素指定指定了内边距 边框 外边距 还是会增加宽度值  (IE传统盒模型 内边距 边框 会在元素的宽度内扩展 ma ...

  5. 浅析CSS负边距

    本文主要讨论两点,1.左右负边距对元素宽度的影响:2.负边距对浮动元素的影响. 在讨论这两点前,首先要理解盒模型.文档流. 盒模型,见下图,简单明了. 文档流,将窗体自上而下分成一行行, 并在每行中按 ...

  6. CSS负边距margin的应用

    原文 简书原文:https://www.jianshu.com/p/75a178e65207 相关文章 CSS负margin的影响:https://www.cnblogs.com/shcrk/p/93 ...

  7. css负边距之详解(子绝父相)

    来源 | http://segmentfault.com 原文 |  The Definitive Guide to Using Negative Margins   自从1998年CSS2作为推荐以 ...

  8. CSS 负边距自适应布局

    单列定宽单列自适应布局: <!DOCTYPE HTML> <html> <head>     <meta charset="UTF-8"& ...

  9. CSS负边距自适应布局三例

    单列定宽单列自适应布局: <!DOCTYPE HTML> <html> <head> <meta charset=”UTF-8″> <title& ...

随机推荐

  1. C++ Primer高速入门之三：几种常见的控制语句

    语句总是顺序运行的:第一条语句运行完了接着是第二条,第三条等等.这是最简单的情况,为了更好的控制语句的运行.程序设计语言提供了多种控制结构支持更为复杂的语句运行.我们就来看看C++ 提供的控制方式. ...

  2. sharepoint 2013 使用SharePoint powershell 2013更改搜索server方法

    $hostA = Get-SPEnterpriseSearchServiceInstance -Identity "DevSearch2013" Start-SPEnterpris ...

  3. 转：java泛型

    1．为什么需要泛型 转载请注明出处:http://blog.csdn.net/seu_calvin/article/details/52230032 泛型在Java中有很重要的地位,网上很多文章罗列各 ...

  4. es6+require混合开发，兼容es6 module，import,export之 加载css及公用date-main

    大家好!上篇文章已经介绍了搭建文件夹,以及加载js文件.现在讲一下加载css ,以及对baseUrl的理解 1.对项目结构的认知 一个项目的结构是根据项目的架构来决定的,当然也可以做到更智能,但是意义 ...

  5. android 网络请求Volley的简单使用

    下载到本地jar包或者在线导入,jar地址:链接:http://pan.baidu.com/s/1gf3VZAb 密码:mmye //定义变量 private RequestQueue mQueue= ...

  6. Python学习日记day3:数据类型

    1.数据类型int :如1.2.4等, 用于计算 bool: True , False ,用户判断 str: 储存少量数据,进行操作.如:'fdasklfjfladfl','而而噩噩','1234' ...

  7. Ionic2 cordova angular2 打包到Android apk环境搭建

    一.前言 前段时间,公司有个APP项目需要支持不同平台,于是采用了Ionic2 + cordova + angular2,在搭建环境过程中遇到了不少问题,刚好最近有时间整理出来. 二.开发环境搭建 参 ...

  8. C:宏定义的一些格式（怕忘记）

    现在还没怎么用到宏定义,但以后肯定会经常用的,写下这盘,以后忘记了可以温故.首先宏定义必须写在函数之外,其作用域从宏定义命令起到源程序结束,也就是说一但定义系统就会分配内存,想让它结束用“#undef ...

  9. 如何在markdown中插入表情

    Markdown是很好用的呀,个人灰常的喜欢,也是灰常漂亮的,但是如何在写文章的时候插入表情呢,下面给出一部分代码

  10. postgresql 导出函数的方法

    先放一条mysql的导出语句 /usr/bin/mysqldump -h127.30.100.33 -P3388 -uname -ppassword --databases databasename ...