1、Background-size 背景尺寸
说明：background-size 规定背景图像的尺寸
属性值
length (10px)
规定背景图的大小。第一个值宽度，第二个值高度。(直接定义背景图的大小)
Percentage(%)
以百分比为值设置背景图大小(参照元素的大小)
cover
把背景图像扩展至足够大，以使背景图像完全覆盖背景区域
contain
把图像图像扩展至最大尺寸，以使其宽度或高度完全适应内容区域。
复合式写法：background: url(img/laoli.jpg) no-repeat 0 0/cover;
说明：backgroun-size和background-position要用 “ / ” 组成一个属性值一起写；
2、background-origin 背景原点(起始点)位置
说明：指定background-origin属性应该是相对位置
属性值
padding-box背景图像填充框的相对位置 (从padding区开始显示背景图)默认值
border-box 背景图像边界框的相对位置(从边框区开始显示背景图)
content-box背景图像的相对位置的内容框 (从内容区开始显示背景图)
3、background-clip 背景裁切
说明：background-clip 属性规定背景的绘制区域。
属性值
border-box背景被裁剪到边框盒。 默认值
padding-box 背景被裁剪到内边距框。
content-box 背景被裁剪到内容框。
扩展：text： 背景被裁剪到文字。说明：-webkit-background-clip: text; 使用时要加浏览器前缀
4、添加多张背景图:
语法：background:url(),url();
background:url(img/corner_lt.gif) no-repeat left top,
url(img/corner_rt.gif) no-repeat right top,
url(img/corner_rb.gif) no-repeat right bottom,
url(img/corner_lb.gif) no-repeat left bottom;
background-color:#63ceff;
5、模糊：blur
filter : blur(value)
说明：值越大，越模糊；
6、图片边框属性：
border-image 属性是一个简写属性，用于设置以下属性:
border-image-source 用在边框的图片的路径。
border-image-slice 图片边框向内偏移(不加单位)。
border-image-repeat图像边框是否应平铺(repeat)、铺满(round)或拉伸(stretch)
border-image-outset边框图像区域超出边框的量(值是一个倍数或者具体的数值)
7、CSS圆角属性：
Border-radius：
语法：border-radius: 20px; 代表每个角的X轴的弧度和Y轴的弧度是一样的；
语法：border-radius: 20px/50px; 代表每个角的X轴的弧度是20px,Y轴的弧度是50px；
说明：10px 20px 30px 40px/50px 40px 30px 20px; “/ ”前表示X轴的弧度 ；“/ ”后 表示Y轴的弧度
用法： border-radius: 10px; 四个角的值都是10px;
border-radius: 10px 20px; 值1：左上和右下 ；值2 ：右上和左下
border-radius: 10px 20px 30px ; 值1：左上 ；值2 ：右上和左下 ；值3：右下；
border-radius: 10px 20px 30px 40px ; 值1：左上 ；值2 ：右上和 ；值3：右下； 值 4：左下
8、css3 calc()(四则运算)
说明：width:calc(100% - 200px);
width:calc(100% - 200px);
注：运算符前后必须要留空格；
+ - * /
加法和减法直接写数值就好；
乘法和除法 要写倍数 不用加单位 ；
9、pointer-events：阻止鼠标事件 、 穿透效果
pointer-events:none;
Like
Like
Love
Haha
Wow
Sad
Angry
