HTML：

<img class="noticeimg-left" src="images/20161118.jpg" alt="新聞圖片" width="182">

CSS：

.noticeimg-left{
  clip: rect(0px 148px 103px 0px);
  position: absolute;
}

HTML：

<img class="noticeimg-right" src="images/20161118.jpg" alt="新聞圖片">

CSS：

  .noticeimg-right{
    clip: rect(0px 579px 80px 0px);
    position: absolute;
    width: 456px;
  }
 

img只顯示圖片一部分 或 css設定背景圖片只顯示圖片指定區域

background-position: 100% 56%; 

設定背景圖片顯示圖片的哪個座標區域，圖片左上角為0，0或0%，0%，右下角為高度和寬度，或100%，100%。

clip:rect(0px 579px 80px 0px); 設定顯示圖片的某個區域，分別是上右下左的順序設定。

clip屬性說明：

• 檢索或設定物件的可視區域。可視區域外的部分是透明的。
• 此屬性定義了絕對(absolute)定位物件可視區域的尺寸。必須將 position 屬性的值設為 absolute ，此屬性方可使用。 

clip屬性基礎語法：
clip : auto 　 rect ( number number number number ) 

取值： 

auto :　 預設值。物件無剪下 
rect ( number number number number ) :　 依據上-右-下-左的順序提供自物件左上角為(0,0)座標計算的四個偏移數值，其中任一數值都可用 auto 替換，即此邊不剪下 


注意事項:
一、clip屬性必須和定位屬性postion一起使用才能生效。
二、clip裁切的計算座標都是以左上角即（0,0）點開始計算，這點不像padding和margin，它們兩個的右邊距和下邊距是從最右邊和最下邊開始計算的。
　　

相容性：現代瀏覽器都支援