CSS中的圖片和文字的距離是一個關(guān)于美觀和用戶體驗的重要問題。通過合適的距離布局，可以達到更好的視覺效果和更好的信息傳達。

首先，我們需要知道的是，HTML中的圖片和文字默認是緊密排列的。如果想要進行調(diào)整，就需要使用CSS。

我們可以通過設置圖片的margin屬性來實現(xiàn)圖片和文字的距離調(diào)整。如下所示：

img {
margin-right: 10px;
}

這樣設置后，圖片和緊挨著它的文字之間就會留出一個10像素的空隙。需要注意的是，這里設置的是圖片的右側(cè)margin值，如果想要實現(xiàn)圖片和文字之間的距離調(diào)整，還需要設置圖片所在盒子的padding值。

有時候，我們想要讓圖片置于文字的上方或下方，這時候就需要使用CSS中的浮動屬性，如下所示：

img {
float: left;
margin-right: 10px;
}

這樣設置后，圖片就會浮動到文字的左側(cè)，文字會自動填充圖片右側(cè)的空缺。如果想讓圖片置于文字的下方，只需要將float屬性設置為"none"，然后設置圖片的margin-top值即可。

還有一種情況，就是當我們想要讓圖片和文字以同樣的寬度展示時。這時候就可以設置圖片的寬度為100%：

img {
width: 100%;
}

這樣設置后，圖片的寬度就會與其所在盒子的寬度相同，從而實現(xiàn)了與文字相同的寬度展示。

以上就是關(guān)于CSS中圖片和文字距離的基本介紹。合理的距離布局會讓我們的頁面更加清晰美觀，提高用戶體驗。