在Vue開發中，我們常會使用背景圖來美化頁面，但在實際使用中卻經常遇到背景圖不清晰的問題。

這個問題可能與圖片的大小有關，當背景圖的尺寸與容器尺寸不匹配時，圖片會被拉伸或壓縮，導致失真。

.container {
width: 100px;
height: 100px;
background-image: url('bg.jpg');
background-size: cover;
}

上面的代碼便設置了一個容器大小為100px x 100px的盒子，背景圖為bg.jpg并且使用了cover屬性。

cover屬性的意思是把背景圖擴大或縮小到能填滿容器，但是可能會導致圖片的質量不佳。

.container {
width: 100px;
height: 100px;
background-image: url('bg.jpg');
background-size: contain;
}

如果我們改用background-size:contain的方式，背景圖會在保留原始比例的情況下盡可能小地放入容器中，但也有可能會出現留白的情況。

總之，在使用Vue開發時，我們要注意background-size屬性的使用，根據頁面需要選擇合適的屬性，以確保背景圖的清晰度。