CSS可以幫助我們設計漂亮的表單樣式，讓網(wǎng)站的輸入界面更加美觀舒適。下面我們就來看一些實用的CSS表單樣式。

.form {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.form input[type="text"],
.form input[type="email"],
.form input[type="password"] {
padding: 10px;
border: none;
border-bottom: 2px solid #dcdcdc;
margin-bottom: 20px;
width: 300px;
}
.form button[type="submit"] {
padding: 10px 20px;
background-color: #00bfff;
color: white;
border: none;
cursor: pointer;
}
form label {
display: block;
margin-bottom: 10px;
font-weight: bold;
}

以上代碼實現(xiàn)了一種簡潔明了的表單樣式，包括輸入框和提交按鈕。值得注意的是，我們使用了flexbox布局，讓表單元素在垂直方向上居中對齊。此外，輸入框的底部邊框使用了淺灰色，讓它們看起來更加立體。

除此之外，我們還可以添加更多的CSS屬性來美化表單。比如，可以為表單元素設置動畫效果，如下所示：

.form input[type="text"],
.form input[type="email"],
.form input[type="password"] {
padding: 10px;
border: none;
border-bottom: 2px solid #dcdcdc;
margin-bottom: 20px;
width: 300px;
transition: all 0.3s ease-in-out;
}
.form input[type="text"]:focus,
.form input[type="email"]:focus,
.form input[type="password"]:focus {
border-bottom: 2px solid #ff8c00;
}

在上面的代碼中，我們添加了transition和:focus屬性，使輸入框在獲得焦點時會有一個漸變的動畫效果，并將邊框顏色更改為橙色。這種效果會使用戶更容易注意到當前輸入框。

在設計表單樣式時，我們還需要考慮到不同瀏覽器的兼容性問題。為此，我們可以使用預處理器，如Sass或Less，來自動生成瀏覽器前綴，避免我們手動添加。

總之，CSS表單樣式可以讓網(wǎng)站更加美觀和易用，同時也可以提升用戶體驗，讓他們更愿意填寫表單和提交信息。