在網頁設計中，我們經常需要設置圖片和文字之間的間距。利用 CSS，我們可以非常方便地設置這種間距，使得頁面看起來更加整潔美觀。 對于圖片和文字的上下間距，可以使用 margin 屬性來控制。例如，我們可以設置一個圖片的下方留出一些空白：

img {
margin-bottom: 20px;
}

在這個例子中，我們設置了圖片的下邊距為 20 像素。這樣，無論圖片的高度是多少，下方都會留出一些空白，以與下方的文字分隔開來。 同樣的道理，我們可以為文字添加上下間距，以使文字看起來更加清晰。例如，我們可以為段落設置一定的上下間距：

p {
margin-top: 20px;
margin-bottom: 20px;
}

這樣，每個段落的上下都會留出 20 像素的空白，以與周圍的元素分隔開來。 當然，并不是所有的元素都需要設置上下間距。有些元素本身就自帶一定的空白，如標題、段落等。這時我們只需要利用 CSS 排版調整一下位置即可。 總而言之，利用 CSS 來設置圖片和文字的上下間距非常簡單，只需要掌握 margin 屬性的使用方法即可。通過合理的間距設置，我們可以讓網頁看起來更加整潔美觀，為用戶帶來更好的體驗。