1. 程式人生 > >clip屬性引數詳解

clip屬性引數詳解

    前面說到圖片裁剪主要用到clip屬性,是css的clip不是canvas的clip(),這裡詳細說一下引數的意義

w3c是這麼介紹的

設定元素的形狀。唯一合法的形狀值是

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

它是一個css屬性,用來進行矩形裁剪,通過傳入對應引數,這4個引數的意義為:

top:矩形上長對應父元素上長的距離(上長就是矩形上邊的長)

right: 矩形右寬對應父元素左寬的距離(右寬就是矩形右邊的寬)

bottom: 矩形下長對應父元素上長的距離

left: 矩形左寬對應父元素左寬的距離

例圖