在web開發中，表單是相當常見的一種元素，而CSS表單的制作也相當重要。下面就讓我們來學習一下如何制作CSS表單吧！

<!-- HTML表單代碼 -->
<form>
<label for="username">用戶名:</label>
<input type="text" id="username" name="username"><br>
<label for="password">密碼:</label>
<input type="password" id="password" name="password"><br>
<input type="submit" value="提交">
</form>

1. 背景顏色和邊框樣式

form {
background-color: #fff;
border: 1px solid #ccc;
padding: 20px;
}

2. 字體和文本框樣式

label {
font-size: 16px;
margin: 10px 0;
display: block;
}
input[type="text"], input[type="password"] {
width: 100%;
padding: 10px;
font-size: 16px;
border: none;
border-bottom: 1px solid #ccc;
margin-bottom: 20px;
}

3. 提交按鈕樣式

input[type="submit"] {
background-color: #007bff;
color: #fff;
font-size: 16px;
padding: 10px 20px;
border: none;
cursor: pointer;
}
input[type="submit"]:hover {
background-color: #0062cc;
}

通過以上CSS樣式的設置，我們可以輕松地制作出一個簡單的CSS表單。