CSS是網頁設計中必不可少的一部分，它可以讓我們實現對網頁元素的樣式、布局等控制，其中最為常用的就是控制各盒子之間的距離。

.container {
margin: 20px; /* 此處可以控制盒子與盒子之間的距離，單位可以是像素、百分比等 */
padding: 10px; /* 此處可以控制盒子內部元素與盒子的距離 */
}
.box {
margin-bottom: 20px; /* 單獨控制每個盒子之間的距離 */
}

通過設置容器的margin屬性可以實現控制各盒子之間的距離，此時我們可以選擇設置上下左右的值，也可以只設置某個方向的值，如margin-bottom: 20px；

而通過設置盒子內部元素和盒子本身的padding屬性，則可以調整盒子內部元素與盒子之間的距離。同樣地，我們也可以控制某個方向的padding，如padding-top: 10px；

.box {
margin: 20px;
padding: 10px;
border: 1px solid #ccc; /* 設置邊框，調整盒子之間的距離 */
}
.box-inner {
margin-bottom: 10px; /* 調整盒子內部元素之間的距離 */
}

最后，我們可以通過添加邊框來實現盒子之間的距離控制。當我們為盒子添加邊框時，盒子之間的距離就是邊框之間的距離。此時我們可以通過為盒子內部元素設置margin或padding屬性，來控制盒子內部元素與盒子之間的間距。