2019-05-30课堂随记

①高度塌陷

答辩题:  1.父元素的垂直外边距不会和子元素重叠

2.开启BFC的元素不会被浮动元素覆盖

3.开启BFC的元素可以包含浮动的子元素

如何开启:

1.设置元素浮动

2设置元素绝对定位

2.设置元素为inline-block

4.将元素的overfoflow设置为一个非visible

IE6以下浏览器不支持BFC

hasLayout

zoom:1;

②清除浮动

clear:left  清除左浮动

          right 清除右浮动

          both  清除影响最大的浮动(可以解决高度塌陷的问题)

用.clearfix:after{

      content:‘插入一个空元素’

      display:block  将内联元素转成块元素

      clear:both 清除浮动}  也可以解决塌陷

.clearfix{

zoom:1;

}  可以使上述代码支持IE6

③定位position

static:静态的 无定位 忽略方向申明

relative:相对定位,不设置偏移量的情况下精致不动;设置left:100 就是距离左边100px 相当               于向右移动100px,是相对于自己原来的位置定位的;相对定位的元素不会脱离文

                      档流,但是比文档高一级

absolute:绝对定位只要开启就会脱离文档流,如果没有设置偏移量元素会静止不动 他是相对于离自己最近的并且开启了定位的祖先来定位的

fixed:固定定位  开启也会脱离文档流  固定定位大多数和绝对定位相同  但是不会根据离自己最近并且开启了定位的祖先来定位  他永远会根据浏览器原点来定位

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,816评论 1 92
  • 什么是盒子? CSS处理网页时,它认为每个元素都包含在一 个不可见的盒子里。 我们只需要将相应的盒子摆放到网页中相...
    咻咻咻滴赵大妞阅读 940评论 0 0
  • 一、在什么场景下会出现外边距合并?如何合并?如何不让相邻元素外边距合并?给个父子外边距合并的范例 在CSS当中,相...
    dengpan阅读 603评论 0 0
  • 1、在文档流中,父元素的高度默认是被子元素撑开的,也就是子元素多高,父元素就多高 但是当为子元素设置浮动以后,子元...
    您的名称已被使用阅读 340评论 0 0
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,802评论 1 45