表格边框实现渐变效果

实现表格的边框渐变效果

效果如下：

这里主要考查border-image的用法，具体使用方法如下：

需要注意border-image的参数和用法 这是一个复合写法

border-image-source:url(‘’) 图片的路径
border-image-slice 图片的裁切方式，4个参数可以是像素值，也可以是百分比。顺序为上，右，下，左。
border-image-width 边框的宽度， 顺序为上，右，下，左。
border-image-outset 边框偏移基准位置的像素值，默认为0，
border-image-repeat 裁切后图片的填充方式，可选stretch/repeat/round,分别为拉伸，重复，平铺，默认值为stretch,顺序为：上下，左右。