margin-bottom
margin-left
布局方式
标准流/静态流
默认布局方式,按照代码书写顺序及标签类型从上到下,从左到右依次显示
浮动布局
主要用于设置块元素的水平排列
属性...元素设置浮动,就具有块元素的特征,可以手动调整宽高
“文字环绕”:浮动元素遮挡正常元素的位置,无法遮挡正常内容的显示,内容围绕在浮动元素周围显示
常见问题
子元素全部设置浮动,导致父元素高度为0,影响父元素背景色和背景图片展示...设置clear:both;清除浮动
为父元素设置overflow:hidden;解决高度为0
定位布局
结合偏移属性调整元素的显示位置
属性
position
取值
可取relative(相对定位...距参照物的顶部
right 距参照物的右侧
bottom 距参照物的底部
left 距参照物的左侧
分类
relative 相对定位:元素设置相对定位,可参照元素在文档中的原始位置进行偏移...堆叠次序
元素发生堆叠时可以使用 z-index 属性调整已定位元素的显示位置,值越大元素越靠上:
属性 : z-index
取值 : 无单位的数值,数值越大,越靠上
堆叠:
定位元素与文档中正常元素发生堆叠