text-shadow、box-shadow、mask 遮罩、 box-reflect、分栏布局、伪元素、. CSS Hack分类、布局扩展

1. text-shadow

   文字的阴影
    x y blur color 

    注：阴影的默认颜色是跟文字样色相同
    注：通过逗号的方式进行分割，可以设置多阴影

2. box-shadow

x
y
blur
spread
color
inset
多阴影

注：盒子阴影的默认样色是黑色。
注：默认就是外阴影，如果设置outset不起作用，可选的值只有inset表示内阴影。

3. mask 遮罩

  url
	repeat
	x
	y
	w
	h
	多遮罩

    注：mask目前还没有标准化，所以需要添加浏览器前缀。

    注：默认是x、y都平铺。

4. box-reflect

above   上
	below   下
	left    左
	right   右
	距离
	遮罩 | 渐变 

    渐变：只是针对透明度的渐变，不能支持颜色的渐变。

5. blur模糊

  filter : blur()

6. calc计算

 四则运算

7. 分栏布局

 column-count : 分栏的个数
  column-width : 分栏的宽度 
  column-gap : 分栏的间距   
  column-rule : 分栏的边线
  column-span : 合并分栏

注：column-width和column-count不要一起去设置。

8. 伪元素

 伪元素本质上是创建了一个有内容的虚拟容器。这个容器不包含任何DOM元素，但是可以包含内容。另外，开发者还可以为伪元素定制样式。
    :: selection
    :: first-line   /    first-letter
    :: before     /     after 
    …	

9. CSS Hack分类

1. CSS属性前缀法
        .elem{ _background:red; }

	2. 选择器前缀法

        *html .elem{ }

	3. IE条件注释法

        IE10以上已经不支持注释法

10. IE低版本常见BUG

 1. 透明度
	2. 双边距
	3. 最小高度
	4. 图片边框

11. 布局扩展

   1. 等高布局
        利用margin-bottom负值与padding-bottom配合实现。

    2. 三列布局，左右固定，中间自适应

        1. BFC方式 
        2. 定位
        3. 浮动 ( 双飞翼布局、圣杯布局 )
            margin负值

        4. flex弹性