CSS從中間往兩邊漸變線是一種非常獨特的樣式設(shè)計，可以讓頁面看起來更加動感和有趣。以下是如何實現(xiàn)這種效果的代碼示例。

background-image: linear-gradient(to right, #000, #fff, #000);
background-size: 200% 100%;
background-position: left bottom;
transition: all .4s ease-out;
:hover {
background-position: right bottom;
}

首先，我們需要定義一個線性漸變的背景圖像。在本例中，我們使用黑色，白色和黑色三種顏色。漸變方向是從左到右，但是我們希望它占據(jù)整個頁面寬度，因此將背景大小設(shè)置為200％以實現(xiàn)這一點。

下一步是為漸變線添加動畫效果。我們使用CSS過渡屬性來定義動畫效果，確保將其從左到右平滑移動，并且速度是漸變效果的一半速度。

最后，我們在:hover狀態(tài)下增加一個新的背景位置，使其從右側(cè)以相同的速度移動。使用:hover狀態(tài)是因為我們希望這個特殊效果僅在用戶指向元素時才會發(fā)生。

這是CSS從中間往兩邊漸變線的一個簡單示例，實際上還有許多其他方式可以實現(xiàn)類似的效果。