在編寫網頁時，我們經常需要插入圖片來美化頁面。但是在使用 CSS 插入圖片時，有時候會遇到圖片被裁切的情況，這就需要我們來進行調整。

background-image: url('example.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: center;

上面的 CSS 代碼是一個常見的插入圖片的方法，其中 background-size 屬性用來設置背景圖片的大小。當這個屬性的值為 cover 時，代表背景圖片會被縮放到能夠完全覆蓋背景區域的大小。但是當圖片與背景區域的比例不同時，就會出現被裁切的情況。

那怎么解決呢？

background-image: url('example.jpg');
background-size: contain;
background-repeat: no-repeat;
background-position: center;

當我們將 background-size 的屬性值設置為 contain 時，背景圖片會被等比例縮放，以便能夠在背景區域內全部顯示。這樣就可以避免圖片被裁切了。

當然，還有其他一些方法可以解決這個問題，比如通過設置 background-position 屬性來使圖片在背景區域內居中。但是在實際開發中，我們應該根據具體的情況選擇最適合的方法來解決圖片被裁切的問題，以便能夠讓頁面更美觀。