CSS可以制作各種形狀的分割線，其中曲線分割線可以給網(wǎng)頁增加流動感和美感。那么如何利用CSS制作曲線分割線呢？下面我們來介紹一下。

/* 創(chuàng)建一條簡單的曲線分割線 */
.divider {
border-top: 2px solid #ccc;
border-radius: 50%;
margin: 20px 0;
width: 100%;
}
/* 創(chuàng)建更復(fù)雜的曲線分割線 */
.divider2 {
border-top: 2px solid #ccc;
height: 30px;
position: relative;
width: 100%;
}
.divider2:before {
content: "";
border-radius: 50%;
border-top: 2px solid #ccc;
height: 30px;
position: absolute;
top: -15px;
width: 240px;
right: 50%;
transform: translateX(50%);
}
.divider2:after {
content: "";
border-radius: 50%;
border-top: 2px solid #ccc;
height: 30px;
position: absolute;
top: -15px;
width: 240px;
left: 50%;
transform: translateX(-50%);
}

上面兩段CSS代碼分別是制作簡單和復(fù)雜曲線分割線的代碼。要制作一條簡單的曲線分割線，只需設(shè)置border-radius屬性為50%即可。如果想要制作更復(fù)雜一點的分割線，則可以使用:before和:after偽類分別代表分割線的左右兩端，然后利用transform屬性的rotate函數(shù)來旋轉(zhuǎn)并調(diào)整分割線的位置。

以上就是制作曲線分割線的簡單介紹，希望可以對大家有所幫助。