波浪線效果是一種在CSS中非常流行的設計技術，它可以使網頁看起來更加美觀和引人注目。下面我們將介紹如何使用CSS中的波浪線效果。 首先，我們需要使用CSS中的偽元素 `::before` 或 `::after` 來創建波浪線。我們可以設置偽元素的 `position` 屬性為 `absolute`，然后使用 `transform: rotate()` 旋轉偽元素，創建波浪線的效果。例如：

p::before {
content: "";
position: absolute;
top: -5px;
left: -5px;
right: -5px;
border-top: 3px solid #333;
transform: rotate(-2deg);
}

上面的代碼將給 `

` 標簽的頂部添加一個波浪線，顏色為黑色，寬度為3像素，旋轉角度為負2度。 我們可以通過調整 `border-top` 的樣式來改變波浪線的樣式。例如，我們可以使用 `border-radius` 屬性來制作彎曲的波浪線，或者使用 `linear-gradient()` 函數來制作漸變的波浪線。

p::before {
content: "";
position: absolute;
top: -5px;
left: -5px;
right: -5px;
height: 10px;
background: linear-gradient(to right, #333 0%, #fff 50%, #333 100%);
border-radius: 100px 50px 0 0;
}

上面的代碼將給 `

` 標簽的頂部添加一個漸變的波浪線，顏色為黑白相間，寬度為10像素，使用 `border-radius` 屬性制作了一個彎曲的波浪線。 在使用波浪線效果時，我們還可以通過CSS動畫來制作動態的效果。例如，我們可以使用 `@keyframes` 關鍵字來創建一個循環動畫，讓波浪線隨時間而變化。例如：

p::before {
content: "";
position: absolute;
top: -5px;
left: -5px;
right: -5px;
height: 20px;
background-color: #333;
animation: wave 2s infinite linear;
}
@keyframes wave {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(-360deg);
}
}

上面的代碼將給 `

` 標簽的頂部添加一個動態的波浪線，顏色為黑色，寬度為20像素，使用 `animation` 屬性制作了一個循環動畫，讓波浪線不斷旋轉。 綜上所述，波浪線效果是CSS中常見的一種設計技術，通過使用偽元素和動畫可以在網頁中創建出各種不同樣式的波浪線。在實際應用中，我們需要根據實際需要選擇最合適的效果，并進行適當的調整和優化，以實現最佳的視覺效果。