border-radius：一个值 5px --> 四个角都是5px
两个值 5px 10px --> 左上、右下5px， 右上、左下10px
三个值 5px 10px 15px --> 左上5px， 右上、左下10px， 右下15px
四个值 5px 10px 15px 20px --> 左上5px， 右上10px， 右下15px， 左下20px
带“/” 2px 5px 8px / 3px 6px
相对于：border-top-left-radius：2px 3px；
border-top-right-radius：5px 6px；
border-bottom-right-radius：8px 3px；
border-bottom-left-radius：5px 6px；
以上就是看文档得出的，其他的还好，“border-top-left-radius：2px 3px；”，1个参数还好理解，2个参数什么鬼？然后，百度百度
好吧，搜百度一圈后，才发现，我一点都不理解
圆角的实现原理：
先来个简单的：border-top-left-radius：5px；
实际上就是创建一个圆半径为5，然后将这个圆放到左上角，进行相切，红色部分就是去掉的部分
那么两个值呢：border-top-left-radius：5px 10px；（如果是border-radius：5px 10px；就不一样了，看清楚了）
就是椭圆的水平半径为5px，垂直半径为10px
border-image：
border-image-source：url("地址")；
border-image-slice：A B C D (数值不用单位或百分数)
距离上部A单位，距离右部B单位，距离底部C单位，距离左部D单位
简单来说就是画了4条线（a，b，c，d）（别管什么ABCD）
如果加上了fill，例如border-image-slice：A B C D fill，中间部分（5）作为背景填充进content
border-image-repeat：这里操作的是1,2,3,4部分
stretch stretch（默认，拉伸；repeat 重复 round 平铺）
border-image-width：边框背景宽度
boeder-image-outset：边框背景往外移动（3px或5，没单位就是倍数）
注意：复合写法需要加前缀，单个写法不用