CSS方塊橫向排列是一種常見的布局方式，它可以將多個方塊沿水平方向排列，并且自適應屏幕大小，非常實用。在本文中，我們將學習如何使用CSS來實現方塊的橫向排列。

.box{
display: inline-block; /* 將方塊設置為行內塊元素 */
margin-right: 20px; /* 設置方塊之間的右邊距 */
}

上述CSS代碼給方塊設置了inline-block的布局，使得方塊可以橫向排列。同時，我們也將方塊之間的右邊距設置為20px，這樣方塊之間就有一定的間隔。

在HTML中，我們可以通過div元素來定義方塊，并添加.box類名來應用上述CSS樣式。

方塊1
方塊2
方塊3
方塊4

通過上述HTML代碼，我們可以定義4個方塊，并且應用.box類名來實現橫向排列。

如果希望方塊大小自適應，我們可以使用百分比來設置寬度，例如：

.box{
display: inline-block;
margin-right: 20px;
width: 25%; /* 將方塊寬度設置為屏幕寬度的四分之一 */
}

通過上述CSS代碼，我們將方塊寬度設置為屏幕寬度的四分之一，實現了自適應布局。

總的來說，CSS方塊橫向排列是一種實用的布局方式，通過設置display為inline-block，可以實現方塊的橫向排列。同時，我們可以通過設置百分比來實現自適應布局。希望本文對你有所幫助。