隨著前端開發技術的不斷發展，越來越多的炫酷網站效果被開發出來。其中，曲線背景是目前備受矚目的一種。下面，我們來介紹如何使用CSS實現曲線背景。

.curved {
background: #ECECEC;
position: relative;
}
.curved:before,
.curved:after {
content: "";
background: inherit;
position: absolute;
width: 200%;
height: 100%;
top: 0;
left: -50%;
z-index: -1;
border-radius: 50%;
}
.curved:before {
transform: translateY(-70%);
}
.curved:after {
transform: translateY(70%);
}

以上代碼實現了一種非常簡單的曲線背景效果。我們首先創建一個父級元素，設置背景顏色。然后創建兩個偽元素before和after，它們的背景色同父級元素。接著，我們給偽元素設置絕對定位、寬度為父級元素的兩倍、高度等同父級元素的高度、top為0px、left為-50%（這樣，偽元素就變成了一個圓）。

接著，我們設置偽元素的z-index值為-1（確保偽元素在父級元素之后渲染）。然后，我們給偽元素都添加了一個border-radius屬性，將它們變成了半圓形。接著，我們通過偽元素的transform屬性，將它們分別垂直向上和垂直向下移動70%的父元素的高度，形成曲線的效果。

如果你需要更加復雜的曲線形狀，則需要使用更多的偽元素，并且需要靈活運用偽元素上的transform屬性，來調整它們的位置和旋轉角度。