網頁設計中怎麼限定圖片大小而不變形?

  • 作者:由 匿名使用者 發表于 攝影
  • 2022-11-20

網頁設計中怎麼限定圖片大小而不變形?ec16502013-07-30

利用css裡的clip屬性進行物件剪下,必須給定4個數值,使用方法如下:

clip:rect(number1 number2 number3 number4),

示例:

先在xhmtl中插入原來大小為400*400的圖象物件;

網頁設計中怎麼限定圖片大小而不變形?

然後使用clip的css程式碼如下:

#imgbox img{ position:absolute; clip:rect( 10px 300px 300px 20px)}分別為上、右、下、左。

top:10px相當於頂部原有上邊為10px,right:300px相當於右邊距離左邊局300px,bottom:300px相當於底邊距離上邊300px,left:20px說明左邊距20px,最終於顯示的圖象大小的width和height為300-20*300-10,則被剪下為一張280*290的圖象。

注意position必須為absolute。

Top