CSS背景圖是頁(yè)面設(shè)計(jì)中經(jīng)常用到的元素之一，可以為網(wǎng)頁(yè)增加豐富的視覺(jué)效果。然而，在使用CSS背景圖時(shí)需要注意的一點(diǎn)是，背景圖默認(rèn)會(huì)根據(jù)內(nèi)容的高度自適應(yīng)，這可能會(huì)導(dǎo)致圖片被拉伸或壓縮失真。那么如何限制CSS背景圖的高度呢？

background-size: cover;

在CSS中，我們可以使用background-size來(lái)設(shè)置背景圖的大小。一般情況下，背景圖的大小可以設(shè)置為contain或cover。其中，contain表示背景圖在盡可能完整地展示圖片的同時(shí)保證圖片不被拉伸或扭曲；而cover則表示背景圖會(huì)在盡可能覆蓋整個(gè)容器的情況下，可能會(huì)將某些部分裁剪掉。

background-size: 100% auto;

除了使用contain或cover之外，我們還可以將background-size設(shè)置為100% auto，這將會(huì)將背景圖的高度限制為容器的高度，而寬度則由圖片自適應(yīng)來(lái)決定，保證不會(huì)失真或拉伸。

然而，在使用這種方式時(shí)需要注意的是，當(dāng)圖片的高度小于容器高度時(shí)，圖片會(huì)被重復(fù)鋪滿容器，可能會(huì)降低視覺(jué)效果。因此，我們還需要結(jié)合實(shí)際情況選擇合適的方式來(lái)設(shè)置CSS背景圖的大小。