css3

```  /* 线性渐变 */
            /* 从上往下  */
            /* background: linear-gradient(to bottom,red,green,blue); */
            /* 从下往上 */
            /* background: linear-gradient(to top,red,green,blue); */
            /* 从左往右 */
            /* background: linear-gradient(to right,red,green,blue); */
            /* 从右往左 */
            /* background: linear-gradient(to left,red,green,blue); */
            /* 从右上到左下 */
            /* background: linear-gradient(to left bottom,red,green,blue); */
            /* 从左下到右上 */
            /* background: linear-gradient(to top right,red,green,blue); */

            /* 径向渐变 */
            /* background: radial-gradient(red 5%,green 30%,blue 60%); */
            /* background: radial-gradient(circle,red 10%,green 30%,blue 60%); */

 div{
            width: 300px;
            line-height: 30px;
            border:1px solid red;
            margin:50px auto;
            overflow: hidden;/* 溢出隐藏*/
            text-overflow: ellipsis;/* 超出的文本用省略号来表示 */
            white-space: nowrap;/* 文本不会换行，在同一行继续 */

        }
         div{
            width: 200px;
            height: 200px;
            border:2px solid red;
            margin:50px auto;
            /* border-radius: 50%; */
            /* 写4个值 按照顺时针顺序 */
            /* border-radius: 0 10px 30px 50px ; */
            /* 左上角 0 右上角 和左下角 为30px（对角） 右下角50px*/
           /*  border-radius: 0 30px 50px; */
           /* 左上角 和右下角30px 右上角和左下角 50px（对角）  */
            /* border-radius: 30px 50px; */

            /* box-shadow默认是外阴影 不设置inset  自动就是外阴影 */
            /* 如果设置inset  就变成了内阴影 */
            /* box-shadow: x轴距离 y轴距离 模糊半径的大小 模糊的颜色; */
            /* box-shadow:inset   0 0 30px royalblue; */

            /* list-style-type 简写list-style
            circle 空心圆
            decimal 数字
            disc 实心圆 默认的
            disclosure-closed 树形图的关闭箭头
            disclosure-open   树形图的打开箭头
            none 没有任何样式
            */
        }