页面布局

position 定位

属性 static、relative、absolute、fixed

static：所有元素都默认的定位

absolute：绝对定位的父元素设置了除static之外的定位，那么它就会相对于它的父元素定位，没有父元素就会相对于html定位。

可以使用left、right、top、bottom4个属性

绝对定位可以层叠通过z-index属性控制大的在上小的在下

relative：相对定位，相对于文件自身正常的位置来实现。可以使用4个属性。

fixed：固定定位，不会随浏览器的滚动而改变。

浮动

float   : left、right

浮动带来的影响解决：

style="clear：both"清楚浮动带来的影响

如果div1中存在div2，div2浮动，导致div1无法被撑开，则在div1中添加一个div设置上面的属性。

解决2：

给父元素添加 overflow：hidden 或者overflow：auto；

 消除浮动带来的影响：

内墙法

外墙法

内边距：padding -  top  bottom right  left

外边距：margin- top bottom right left

添加滚动条：

overflow：auto;   overflow:scroll

overflow-x : hidden  禁止横向滚动， overflow-y：禁止纵向滚动。

多列显示样式

column-with   指定列宽度不可为负

column-count 设置列数取值大于0整数

column-gap 列与列间距

column-rule ：width style color；设置列分割线

column-span：all； 设置元素跨列显示