文本换行&背景属性&图片边框&CSS圆角&线性渐变&径向渐变

文本换行：

word-wrap：normal（只在允许的断字点换行）/

                       break-word（允许长单词或URL地址换行到下一行）

word-break：break-all（在单词内直接换行）/

                       keep-all （文本不会换行，只在半角空格或连字符处换行）

背景属性：

background-origin：背景原点（背景显示的原位置）

    属性值：

1. padding-box  背景图像填充框的相对位置  默认值；
2. border-box    背景图像边界框的相对位置；
3. content-box   背景图像的相对位置的内容框；

background-clip：背景裁切

    属性值：

1. border-box   背景被裁剪到边框盒， 默认值；
2. padding-box   背景被裁剪到内边距框；
3. content-box  背景被裁剪到内容框；

background-size：背景尺寸

   属性值：

1. length  规定背景图的大小，第一个值宽度 第二个值高度；
2. percentage  以百分比为值设置背景图大小；
3. cover  把背景图像扩展到足够大，以使其完全覆盖背景区域；
4. contain  把背景图像扩展至最大尺寸，以使其宽度或高度完全适应内容区域；

图片边框：

border-image 该属性是简写，展开写是如下属性：

1. border-image-source  路径；
2. border-image-slice  图片边框向内偏移（不加单位）；
3. border-image-repeat   平铺repeat、铺满round 、拉伸stretch；
4. border-image-outset   边框图像区域超出边框的量（值是个倍数）；

CSS圆角：

border-radius：左上  右上 右下 左下；

border-radius：10px/20px（水平半径/垂直半径）；

border-radius：10px  20px 30px 40px /40px 30px 20px 10px（水平半径/垂直半径）；

线性渐变：

background:linear-gradient(direction方向，渐变的颜色1，渐变的颜色2........)

方向：to left / right /top / bottom 默认;

          to right bottom / to right top / to left bottom / to left top; 

          使用角度渐变：linear-gradient(10deg,red,blue)

径向渐变：

background:radial-gradient(center，shape，size，start-color,.......last-color);

center：渐变起点的位置，第一个值表示水平，第二个值表示垂直，

              可为百分比，默认是图形的正中心；

shape：形状，ellipse椭圆(默认) 、 circle 圆形 ；

             若元素为正方形，则两种属性值表现出来的形状一样 

size：渐变大小，即渐变到哪里停止；closest-side最近边，farthest-side最远边，closest-corner最近角，farthest-corner最远角