css3：多列，postion

1.多列

column-count 属性指定了需要分割的列数。

column-width 属性指定列的宽度

columns设置 column-width 和 column-count 的简写

column-gap 属性指定了列与列间的间隙。

 边框样式

       column-rule-style 属性指定了列与列间的边框样式

       column-rule-width 属性指定了两列的边框度

       column-rule-color 属性指定了两列的边框颜色

    column-rule 属性是 column-rule-* 所有属性的简写

column-span  属性指定元素可以跨越多少列

2.postion常用的5大属性值：

--sticky：基于用户的滚动位置来定位。也就是以sticky标签定义的标签会随着页面上下移动，但是其内容却不会超过屏幕比如在网站侧边那些移动导航栏。

--static：HTML元素的默认值，即没有定位，元素出现在正常的流中。静态定位的元素不会受到 top, bottom, left, right影响。也就是和没写position一样的效果。

--fixed：元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动，相当一个壁纸标签一样一动不动像镶嵌在屏幕里一样，在很多网站尤其是购物网站里面经常能看到，你看到页面侧边那静静躺在那的导航栏就是用fixed实现的

--relative与absolute：相对定位元素的定位是相对其正常位置。每个标签的样式设置从来都是针对自己的，但是会对其余标签产生相对影响，html很重要的一点就是嵌套关系即标签里有标签，首先在平级我们看下效果两个<div>是兄弟关系

3.行内块  overflow

4.伪元素::after和::before

::after和::before的使用很简单，可以认为其所在元素上存在一前一后的两个的元素，这两个元素默认是内联元素，但我们可以为其增添样式。::after和::before使用的时候一定要注意，必须设置content，否则这两个伪元素是无法显示出来的。而content属性，会作为这两个伪元素的内容嵌入他们中