美文网首页
高度塌陷 清除浮动 定位

高度塌陷 清除浮动 定位

作者: 圣召唤 | 来源:发表于2019-03-27 09:39 被阅读0次

高度塌陷 父元素中的子元素浮动,导致父元素塌陷   开发中避免出现

写死父元素高度可以解决,但不能随子元素变化,不推荐

bfc 开启后具有特性 :1.开启后父元素的垂直外边距不会和子元素重叠  2.开启bfc的元素不会被浮动元素所覆盖。 3.开启bfc的元素可以包含浮动的子元素 

如何开启BFC 1.设置元素浮动 2.设置元素绝对定位 3.设置元素为inline-block 4.将元素的overfkow设置为一个非visible的值(非默认值)overflow:hidden

haslaout 用于ie6 

清除浮动 clear letf、right、both(清楚影响最大的)、none 消除浮动带来的影响 清楚浮动影响的是兄弟元素之间的浮动 父子元素不受影响  清楚浮动解决高度塌陷

解决父子高度塌陷 可用 在子元素末尾添加一个空元素,对空元素清楚浮动 可实现解决父子高度塌陷 

IE6不支持伪类

定位 position :relative  left:100px、right...、top...、bottom..

相对定位不会脱离文档流,移动后原位置存在 相对于自身定位

position absolute  绝对定位,脱离文档流 参照最近的开启了定位祖先元素的定位 都没开定位的话 绝对定位参照浏览器起点   绝对定位会使元素提升层级(覆盖效果)脱离文档流 内联元素会变成块 宽高属性会影响设置绝对定位的元素

相关文章

  • 清除浮动,定位

    定位 clear 清除左浮动 清除右浮动 both 可以清除对它影响最大的浮动可以解决高度塌陷 谁塌陷就加上cle...

  • 高度塌陷和定位

    高度塌陷 导航条 清除浮动 相对定位 绝对定位 固定定位 作业

  • HTML-05day

    1、高度塌陷 2、清除浮动 3、导航条 4、解决高度塌陷 5、相对定位 6、绝对定位 7、近期开班

  • 2018-11-22

    导航条 清除浮动 解决高度塌陷 相对定位 绝对定位 固定定位 作业

  • 高度塌陷 清除浮动 定位

    高度塌陷 父元素中的子元素浮动,导致父元素塌陷 开发中避免出现 写死父元素高度可以解决,但不能随子元素变化,不推...

  • 清除浮动

    清除浮动的方法(只要触发BFC,就可以清除浮动,预防父元素的高度塌陷) 1.给父元素添加浮动或者定位属性 2.给父...

  • CSS 中的浮动

    浮动的定义: 元素脱离文档流 举栗子: 修改 CSS 代码,清除浮动: 浮动的影响: 父元素高度塌陷 清除浮动: ...

  • 高度塌陷、清除浮动、元素垂直居中

    高度塌陷: 定义:父元素没有设置高度,子元素设置了浮动(float)属性解决办法:清除浮动(仅清除浮动的负面影响,...

  • 高度塌陷-清除浮动

    float布局会脱离文档流,对页面的布局造成影响,比如造成父级的高度坍塌(父元素自身没有高度,由子元素高度撑开,当...

  • 清除浮动

    clear both 可以清除对它影响最大的浮动 可以解决高度塌陷

网友评论

      本文标题:高度塌陷 清除浮动 定位

      本文链接:https://www.haomeiwen.com/subject/dtravqtx.html