css 如何顯示部分圖片

css顯示部分圖片的實作方法：先在html裡建立一個div，用來放背景圖片的；然後為div添加css樣式，並添加背景圖片url；最後添加一個“background-position”的樣式，並為樣式添加適當的負數值即可。

本教學操作環境：windows7系統、css3版，此方法適用於所有品牌電腦。

推薦：《css影片教學》

css如何只顯示部分圖片？

先在html裡建立一個div，用來放背景圖片的。

為div新增css樣式，新增背景圖片url。

重新整理頁面，可以看到現在是整張圖片都顯示的。

假設我們現在需要只顯示圖片中人物的頭像部分，我們需要修改圖片的長度和寬度，設定為頭像部分的大小，70元素左右。

然後加入一個background-position的樣式，為樣式加入適當的值。注意的是這個數值是負數的，不同的數值會顯示圖片的不同部分，大家可以調整嘗試。

重新刷新頁面，可以看到現在是只顯示了圖片上的頭像部分了。

如果是圖片太大，但容器太小，我們要顯示完整的圖片，可以使用background-size的樣式，如圖。

運行頁面後，我們的容器上就顯示了完整的背景圖片了，但對圖片進行了縮放的。

以上是css 如何顯示部分圖片的詳細內容。更多資訊請關注PHP中文網其他相關文章！