CSS文本框圓角的寫法

在CSS中，我們可以使用border-radius屬性來(lái)讓文本框的邊角變圓，這個(gè)屬性接受一個(gè)數(shù)值，該數(shù)值表示圓角的半徑大小。

如果你想要一個(gè)半徑為10px的圓角文本框，你可以這樣寫：

input {
    border-radius: 10px;
}

如果你想要讓四個(gè)角都變?yōu)閳A角，那么上述代碼就足夠了，如果你想要讓某些角變?yōu)閳A角，而其他角保持直角，那么你可以使用border-top-left-radius、border-top-right-radius、border-bottom-left-radius和border-bottom-right-radius這四個(gè)屬性來(lái)分別設(shè)置每個(gè)角的圓角半徑。

如果你想要讓左上角和右下角變?yōu)閳A角，而其他角保持直角，那么你可以這樣寫：

input {
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

這樣，文本框的左上角和右下角就會(huì)變成半徑為10px的圓角，而其他角則保持直角。