在使用CSS設(shè)置背景圖片的時候，有時候會出現(xiàn)圖片拉伸失真的情況，這給網(wǎng)站的美觀度帶來了一定的影響。下面我們來介紹一下解決這個問題的方法。

background-image: url("xxx.jpg");
background-size: cover;

利用CSS中的background-size屬性，我們可以設(shè)置背景圖片的大小，來適應(yīng)所在的位置。如果設(shè)置為cover，表示盡量鋪滿整個區(qū)域。如果不想鋪滿，可以設(shè)置為contain。

background-image: url("xxx.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;

還可以單獨(dú)使用background-size屬性對寬度與高度進(jìn)行設(shè)置，使圖片鋪滿所在的位置。并且設(shè)置background-repeat為no-repeat，則可以避免圖片重復(fù)出現(xiàn)。

如果背景圖片是平鋪過的結(jié)果，就會是圖片鋪滿整個區(qū)域，但不會失真，因?yàn)槊恳粋€小塊都是原圖片的一部分。

綜上所述，我們可以根據(jù)具體情況選擇不同的設(shè)置方式，避免圖片拉伸失真。