CSS表單怎么做圓角矩形

在CSS中，我們可以使用border-radius屬性來(lái)制作圓角矩形，這個(gè)屬性可以應(yīng)用于表單元素，如input、select、textarea等，以及其他HTML元素。

我們需要?jiǎng)?chuàng)建一個(gè)HTML表單元素，例如一個(gè)input文本框，我們可以使用CSS為該元素添加樣式，使其呈現(xiàn)圓角矩形的形狀。

以下是一個(gè)示例代碼：

HTML代碼：

<input type="text" class="rounded-input">

CSS代碼：

.rounded-input {
  border-radius: 10px;
  border: 2px solid #000;
  padding: 5px;
}

在上面的代碼中，我們?yōu)閕nput元素添加了一個(gè)類名“rounded-input”，并在CSS中定義了這個(gè)類的樣式，border-radius屬性設(shè)置為10px，表示圓角的半徑為10像素，border屬性設(shè)置了邊框的顏色和寬度，padding屬性設(shè)置了內(nèi)邊距。

運(yùn)行上述代碼后，你將看到一個(gè)帶有圓角矩形的文本框，你可以根據(jù)需要調(diào)整border-radius、border和padding的值，以改變圓角矩形的樣式，你也可以將上述代碼復(fù)制到其他表單元素或HTML元素上，以實(shí)現(xiàn)不同元素的圓角矩形效果。