clip属性参数详解

    前面说到图片裁剪主要用到clip属性，是css的clip不是canvas的clip()，这里详细说一下参数的意义

w3c是这么介绍的

设置元素的形状。唯一合法的形状值是

clip : rect (top, right, bottom, left)

它是一个css属性，用来进行矩形裁剪，通过传入对应参数，这4个参数的意义为：

top：矩形上长对应父元素上长的距离(上长就是矩形上边的长)

right： 矩形右宽对应父元素左宽的距离(右宽就是矩形右边的宽)

bottom: 矩形下长对应父元素上长的距离

left： 矩形左宽对应父元素左宽的距离

例图