武汉web培训
达内武汉中心

18571612865

热门课程

武汉web培训:margin重叠和固定层

  • 时间:2016-04-29 11:17
  • 发布:武汉web培训
  • 来源:web教程

一、固定层之position:fixed

    Fixed定位 

    1. 属于三大布局中的层定位 

    2. 特点

    位置固定不变,兄弟元素会从下面穿过。

    3. 漂移量的设置

    未设置漂移量 :

    有已经定位的祖先元素: 以祖先元素为基准定位,在其左上角
    无已经定位的祖先元素: 以浏览器的窗口定位

    设置偏移量 :

    有无已经定位的祖先元素,均已浏览器窗口定位,偏移。

    如果希望固定层,在某一个包含块中,不随页面的滚动而消失,不设置偏移量即可实现。

    4. 对比position:absolute

    表现形式 : 产生滚动条时,fixed会覆盖absolute属性的内容。

    区别主要在于,设置偏移量后,看是否已定位的偏移祖先元素:absolute会以那个祖先元素为标准,而fixed始终以浏览器窗口为基准。

二、margin的重叠

    含义:

    重叠:3D盒模型在垂直方向上的叠加

    在普通文档流中的块级框中(绝对定位以及浮动则不会出现),垂直方向上如果margin值存在重叠----也就是外边距合并:当两个垂直外边距相遇时会发生外边距合并,合并后的外边距的高度等于两个外边距中较大的外边距值。所以最好在父级元素里加margin,在子级元素里用padding。

    解决方法:

    再次调整margin的值即可

马上预约七天免费试听课

姓名:

电话:

上一篇:运用HTML5实现计时动画效果
下一篇:武汉web培训:网页布局的三种方法

web前端学习容易犯的错误

web1702“诱人”活动

抽象类和抽象方法

jquery的ajax和getJson跨域获取json数据

选择城市和中心
江西省

贵州省

广西省

海南省

有位老师想和您聊一聊