- 博客(10)
- 收藏
- 关注
原创 布局中高度塌陷问题
父元素高度丢失以后,其下的元素会自动上移,导致页面的布局混乱,所以高度塌陷是浮动布局中比较常见的问题,我们必须解决。当子元素浮动后,子元素会完全脱离文档流,子元素从文档流中脱离,将会无法撑起父元素的高度,导致父元素的高度丢失。当开启元素的BFC以后,元素会变成一个独立的布局区域,不会在布局上影响到外面的元素。由于这个div并没有浮动,所以他是可以撑开父元素的高度的,在浮动布局中,父元素的高度默认是被子元素撑开的。可以直接在高度塌陷的父元素的最后,添加一个空白的div,给父元素设置固定的高度,但不推荐使用。
2022-10-18 20:38:25
144
1
原创 浮动和布局
1、元素脱离文档流,元素一旦脱离文档流,就不会占据原来在文档流中的位置,1:浮动元素会脱离文档流,元素脱离文档流以后,不会再占用文档流的位置,它下边的元素会立即向上移动。布局方式:文档流中元素默认的布局方式,margin,浮动,定位,弹性盒子,网格布局·····浮动:设置元素浮动,可以让元素脱离文档流,从而不具有元素在文档流中特点,当浮动的元素碰到文字,浮动的元素不会盖住文字,而文字会环绕浮动的元素,5:如果浮动元素的上边是一个没有浮动的块元素,则浮动元素无法上移。5、浮动元素不会超过其父元素的范围。
2022-10-17 20:12:08
83
原创 页面的布局简介
margin-left、margin-right 为auto margin-left、margin-right各占一半,把元素挤到中间。2、水平方向7个值当中,有三个值可以被设置为auto,width、margin-left、margin-right。width、margin-left、margin-right都为auto,调整的是width。width、margin-right 为auto 调整的是width。width、margin-left 为auto 调整的是width。
2022-10-14 18:41:44
110
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人