总结: 1.无序列表去除前面的小点点：list-style-type: none;
2.设置左浮动的间距。
外边距：margin :如果设定4个值就是，上右下左的顺序设置
如果设置3个值，那么左和右边一个值
如果俩值，那么上和下一个值，左和右一个值
如果一个值，那么上下左右一个值
也可以一个值单独设置
;
3.内边距 padding：设置规则和外边距一样。
4.溢出隐藏：overflow:hidden
5.溢出加滚动条：overflow：scroll
6.浮动：float：left/right 左移/右移
7.清除浮动：clear:left/right/both 左/右/全部

div的浮动、清除浮动和布局的更多相关文章

  1. Unit 6.标准文档流,浮动,清除浮动以及margin塌陷问题

    一. 什么是标准文档流 文本流其实就是文档的读取和输出顺序,也就是我们通常看到的由左到右.由上而下的读取和输出形式,在网页中每个元素都是按照这个顺序进行排序和显示的,而float和position两个 ...

  2. div+css之清除浮动

    当元素有浮动属性时,会对其父元素或后面的元素产生影响,会出现一个布局错乱的现象,可以通过清除浮动的方法来解决浮动的影响. 浮动的清理(clear): 值:none:默认值.允许两边都可以有浮动对象:l ...

  3. [css]浮动-清除浮动的3种方法

    清除浮动的方法: 内墙法 注: 这是个奇淫技巧,没什么原理可言,记住即可 这个技巧又使得父box重新可以被子box撑开高度了. 隔墙法-适用于2个box之间上下排列 由于2个box高度依旧是0, 彼此 ...

  4. CSS清除浮动技巧

    一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了. 本来两个黑色对象盒子是在红色盒子内,因为对两个黑色盒子使用了f ...

  5. 【转】CSS清除浮动_清除float浮动

    CSS清除浮动方法集合 一.浮动产生原因 一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了. 浮动产生样式效果截图 ...

  6. 浮动（float）与清除浮动（clear）

    上一篇中我们了解了块级元素与内联元素,今天将自己查阅的资料整理写出来,与大家一起理解什么是浮动,以及怎样清除浮动,本文以div元素为例. 浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮 ...

  7. CSS清除浮动_清除float浮——详解overflow:hidden 与clear:both属性

    最近刚好碰到这个问题,看完这个就明白了.写的很好,所以转载了! CSS清除浮动_清除float浮动 CSS清除浮动方法集合 一.浮动产生原因   -   TOP 一般浮动是什么情况呢?一般是一个盒子里 ...

  8. CSS清除浮动方法集合

    CSS清除浮动方法集合 一.浮动产生原因   -   TOP 一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了. ...

  9. CSS清除浮动_清除float浮动

    2.clear:both清除浮动为了统一样式,我们新建一个样式选择器CSS命名为“.clear”,并且对应选择器样式为“clear:both”,然后我们在父级“</div>”结束前加此di ...

  10. css清除浮动的集中方法

    一:浮动产生的副作用 1.父元素的背景不能显示 2.父元素的边框不能撑开 3.padding和margin失效 二:清除浮动的方法 1.给父元素设置高度:这样可以清除浮动,但是子元素内容高度不固定,这 ...

随机推荐

  1. Android Zxing框架扫描解决扫描框大小，图片压缩问题

    在我们是Zxing框架进行二维码扫描的时候,会发现,如今手机随着分辨率的添加.那个扫描框会越来越小,在1920*1280和1280*720还算比較正常.可是三星的几款手机note4,5.S6,等几款手 ...

  2. 四:Java之字符串操作String、StringBuffer和StringBuilder

    string是我们经经常使用到的一个类型,事实上有时候认为敲代码就是在重复的操作字符串,这是C的特点,在java中.jdk非常好的封装了关于字符串的操作.三个类String .StringBuffer ...

  3. web的自己主动化公布

    </pre>基于眼下业务的版本号.使用的maven 及tomcat <p></p><p>假设我们使用 Jenkins 公布是比較好的,可是存在一定的问题 ...

  4. PHP正则表达式-从文本中提取URL

    1.从文本中提取URL的正则表达式 '/https?:\/\/[\w-.%#?\/\\\]+/i'

  5. Cache-control no-transform Robots Exclusion Protocol

    蜘蛛协议 <今日头条>支持蜘蛛协议(Robots Exclusion Protocol)"ToutiaoSpider",同时,我们尊重所有的网络媒体,如媒体不希望内容被 ...

  6. 处理new分配内存失败情况

    转自:http://www.51testing.com/html/70/n-827070.html 在C++语言中,我们经常会使用new给一个对象分配内存空间,而当内存不够会出现内存不足的情况.C++ ...

  7. 速度上手LM4F LaunchPad 输出多路PWM波

    最近转战到TI的Cortex M4平台后,发现网上关于TI的LM4F120 Launchpad 资料太少了,而且其中大部分都是TI员工或者其合作伙伴提供的,例程太少,导致新手上手很慢. 我只是要实现几 ...

  8. Android 自带Base64加密解密

    Android项目引用不到以下两个java类 import sun.misc.BASE64Decoder; import sun.misc.BASE64Encoder; Android有自己的base ...

  9. webrtc学习资源

    http://www.imaotao.cn/project/webrtc-201604

  10. ngRoute (angular-route.js) 和 ui-router (angular-ui-router.js) 模块有什么不同呢？

    ngRoute (angular-route.js) 和 ui-router (angular-ui-router.js) 模块有什么不同呢? 很多文章中都有说道:当时ngRoute在路由配置时用$r ...