CSS 圖片怎么完整顯示

在網頁設計過程中，圖像元素通常是不可或缺的。在 CSS 中，我們使用 background-image 屬性設置背景圖像。但是，該屬性的默認值是 repeat，也就是將圖像重復至填滿容器。若我們希望圖像能夠完整顯示在容器內，有以下兩種方法：

方法一：
background-repeat: no-repeat;
background-size: contain;

使用 background-repeat 屬性定義圖像不重復，在控制圖像顯示寬高比的同時，用 background-size: contain 保證圖像完整顯示在容器中。

方法二：
background-size: cover;
background-position: center;

使用 background-size: cover 定義圖像盡量鋪滿容器，并用 background-position: center 居中顯示圖像。當然，這樣可能裁剪掉一部分圖像，但是可以更好地填滿容器。

在實際使用中，我們可以根據需求選擇合適的方法來完整顯示圖片素材，提高我們網頁設計的質量。另外，我們也可以使用 img 標簽來插入圖片，并用 CSS 控制圖片的顯示方式。