CSS是前端開發中用來控制樣式的重要技術，其中對于圖標的位置調整也是經常需要用到的。本文將介紹如何使用CSS控制圖標在左右方向上的距離。 在HTML中，通常我們會使用圖標字體或者圖標圖片來實現頁面設計中需要的圖標功能。而在CSS樣式中，我們可以通過調整元素的margin值來控制圖標在左右方向上的距離。比如，下面的示例代碼就是將一個使用了字體圖標的按鈕向右移動了10個像素。

.icon-btn {
font-size: 20px;
margin-right: 10px;
}

上述代碼中，我們給按鈕元素添加了一個class名為“icon-btn”的樣式，并通過設置margin-right值調整了它在右側的距離。 同樣地，在使用圖片圖標的情況下，我們也可以通過CSS中的background屬性來調整圖標的位置。假設我們使用了一個名為“icon.png”的圖片作為圖標，并希望將它向左移動20像素，則代碼如下：

.icon {
width: 20px;
height: 20px;
background: url('icon.png') no-repeat left 20px;
}

上述代碼中，我們給圖標元素添加了一個class名為“icon”的樣式，并通過設置background屬性中的left和top兩個值來控制圖標的位置。 總之，通過CSS的margin和background屬性的靈活應用，我們可以輕松控制圖標在左右方向上的距離，使得頁面設計更加美觀、實用。