29.html-盒子边框、阴影、外边距合并

边框：
        border-width：用于指定边框的粗细。
        border-style：用于定义边框的样式。
        border-color：用于设置边框的颜色。
         /* border：边框 宽度 样式 颜色 四个方向都是一样的 */
            /* border：2px solid red； */
            /* soild：实线
               dotted：点线
               dashed：虚线
               double：双实线 */
            /* 总体设置 */
            border-top: 5px solid red;
            border-left: 10px dotted blue;
            border-bottom: 10px dashed green;
            border-right: 15px double yellow;
            /* 分开设置 */
            border-top-width: 20px;
            border-top-color: blueviolet;
            border-top-style: solid;
            /* 宽度综合：上右下左 */
            border-width: 15px 5px;
            /* 样式综合 */
            border-style: double;
            /* 颜色综合 */
            border-color: chartreuse;
            /* 最终综合 */
            border: 15px dashed burlywood;

圆角边框：
        /* 宽度*50% 高度*50% 横向纵向的一共圆角设置 */
            border-radius: 5%;
            /* 左上角 */
            border-top-left-radius: 100px;
            /* 左上 右上 右下 左下的顺序 如果没有 就从对角取值 */

盒子阴影：
        box-shadow: 
            水平阴影位置(h-shadow)  必须 增大 向右
            垂直阴影位置(v-shadow)  必须 增大 向下
            阴影模糊距离(blur)  可选 值越高 越模糊
            阴影尺寸(spread)  可选 向外延展的尺寸
            阴影颜色(color)  可选
            外部or内部(inset)  可选

外边距盒子水平居中：/* 盒子在父盒子水平居中 上下0px 左右auto */

外边距合并：
        同层级：
                /* 同层级的合并 上下 采用较大值 而不是两者加起来 */
                /* 要求不要既用上盒子的下边距 又用下盒子的上边距 */
        嵌套：
                /* 父子外边距合并 父子外边距传递 只有子盒子的margin-top才会传递给父盒子 */