CSS是網頁設計的重要語言之一，我們可以使用它來控制網頁元素的樣式和排版。其中，標題與內容之間的距離是網頁設計中比較重要的一個問題，下面我們就來探討一下如何通過CSS來控制標題和內容的距離。

h1 {
margin-top: 30px;
}

以上是一個簡單的CSS代碼，它使用了margin-top屬性來控制h1標題與上方元素之間的距離。margin-top的值可以自由設定，其中30px表示30像素，可以根據實際需要調整數值。

h1, h2, h3, h4, h5, h6 {
margin-bottom: 20px;
}

如果我們要控制所有標題和內容之間的距離，可以使用一個簡單的CSS代碼段。其中，margin-bottom屬性被用來控制標題與下方元素之間的距離，同樣可以根據實際需要自由設定數值。

h1 + p {
margin-top: 30px;
}

如果我們只想控制某個標題與緊隨其后的第一個段落之間的距離，可以使用上面的CSS代碼。+符號表示緊隨其后的元素，這里我們使用margin-top屬性來控制它們之間的距離。同樣，數值可以自由設定。

總之，通過CSS來控制標題和內容之間的距離是網頁設計中十分重要的一部分。我們可以根據實際需求，使用不同的屬性和數值來達到最佳的設計效果。