前端基础复习--20 文字阴影？盒子阴影？mask遮照？倒影？filter:blur()模糊？calc计算？

1. text-shadow:
    文字的阴影
    x y blur（模糊程度） color 

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

2. box-shadow：盒子阴影是针对容器的 
    x
    y
    blur（模糊程度 px）
    spread（阴影范围 px）
    color
    inset（内阴影）  内阴影还是外阴影 默认是外阴影
    可以设置多阴影，用，隔开

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

    hover的时候向上偏移可以用浮动来做 在hover的时候改变浮动位置，如设置top:-3px;这样做

3. mask 遮罩

    url
    repeat
    x
    y
    w 宽
    h 高
    可以设置多遮罩

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

    注：默认是x、y都平铺。 只有mask是实心的区域才可以，透明的区域就不行

4. box-reflect   倒影 要加浏览器前缀 
    above   上
    below   下
    left    左
    right   右
    距离
    倒影中的第3个参数：遮罩 | 渐变 （可以做遮照或渐变）

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

5.   blur模糊
        filter : blur()
        例如：
        filter : blur(20px)

6. calc计算
        四则运算 
        例如：
            calc（100%-100px）