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，沒單位就是倍數）
注意：複合寫法需要加前綴，單個寫法不用