CSS底部曲線是一種常見的網(wǎng)頁設(shè)計(jì)元素，它可以為網(wǎng)頁帶來一種獨(dú)特的美感和時(shí)尚感。在 CSS 中，我們可以使用偽元素 :before 和 :after 來創(chuàng)建底部曲線效果。

.footer{
position: relative;
width: 100%;
height: 100px;
background-color: #333;
}
.footer::before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 40px;
border-bottom-left-radius: 50%;
border-bottom-right-radius: 50%;
background-color: #fff;
}

在上面的代碼中，我們?yōu)榈撞吭?.footer 添加了一個(gè)偽元素 :before，并設(shè)置了它的高度為 40px，寬度為 100%，顏色為白色，同時(shí)使用了 border-bottom-left-radius 和 border-bottom-right-radius 屬性來實(shí)現(xiàn)底部圓弧效果。

除了使用偽元素，我們也可以通過設(shè)置圓形背景圖像的方式來實(shí)現(xiàn)底部圓弧效果。

.footer{
position: relative;
width: 100%;
height: 100px;
background-color: #333;
background-image: radial-gradient(circle at 50% -70%, transparent 45%, #fff 40%);
}

在上面的代碼中，我們?yōu)榈撞吭?.footer 設(shè)置了一個(gè)徑向漸變的背景圖像，使用了 circle 關(guān)鍵字指定了漸變的形狀為圓形，并設(shè)置了背景圖像的位置在 x 軸上的 50% 處，y 軸上的 -70% 處，也就是底部留出了一個(gè)空白的高度，同時(shí)設(shè)置了漸變的顏色，實(shí)現(xiàn)了底部的圓弧效果。

綜上所述，CSS 底部曲線是一種非常實(shí)用的設(shè)計(jì)元素，通過偽元素和背景圖像的方式可以輕松地實(shí)現(xiàn)，它能夠?yàn)榫W(wǎng)頁帶來時(shí)尚感和美感，同時(shí)也能有效提高用戶的體驗(yàn)度。