高度塌陷及其解决(导航条)

2019-12-16  本文已影响0人  栀心_d553

父元素的高度可以比子元素小,子元素可以把它撑开,

塌陷指的是:父元素包不住子元素


BFC开启后具有特性:(块的格式化)

1、父元素的垂直外边距不会和子元素重叠

2、开启BFC的元素不会覆盖其他的元素

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


如何开启BFC?

1、设置元素浮动

2、设置元素绝对定位

3、设置元素为inline-block

4、将元素的overflow设置为一个非visible的值,经常使用的是hidden

(当父元素包不住子元素的时候,给父元素设置overflow和zoom)

推荐第四个,副作用小


IE6及以下的浏览器使用haslayout,只要设置宽度就会默认开启,不会塌陷

zoom:1;

两个都写上,就可以解决所有浏览器的塌陷


ul.nav>(li>a)*4 简写
.nav li{}后代元素选择器
右浮动,所有的字顺序也会颠倒


查色:右键,检查,点击:hover,

上一篇 下一篇

猜你喜欢

热点阅读