CSS過渡是一種讓元素從一種樣式逐漸改變為另一種樣式的動畫效果。其中一個重要的應用就是改變元素的left屬性，讓它在屏幕中水平移動。

.box {
position: relative;
left: 0;
transition: left 1s ease;
}
.box:hover {
left: 300px;
}

上述代碼就實現了鼠標懸停在元素上時，元素從左側移動到右側的過渡效果。其中，transition屬性指定了過渡效果的屬性、執行花費的時間、以及運動狀態。在這里，我們設置了left屬性在1秒內從當前值過渡到新值，并且以緩慢的運動效果執行。

而:hover偽類則表示當鼠標懸停在該元素上時，應用下列CSS樣式。在這里，我們將元素的left屬性設置為300像素，表示它應該在左邊距離屏幕左側300像素的位置停留，并在1秒內慢慢移動到這個位置。

除此之外，我們還可以利用transition-timing-function屬性調整過渡的運動狀態，例如讓元素先快速移動再緩慢移動，或者反之。我們也可以通過設置不同的過渡屬性和不同的執行時間，實現更加復雜和有趣的過渡效果。