CSS是前端開發中的基礎技能之一，同時也是控制輸入框樣式的必備技能之一。在本文中，將介紹如何使用CSS控制輸入框樣式。

首先，我們需要創建一個輸入框。

<input type="text" id="input-box" name="input-box" placeholder="請輸入內容">

接下來，我們使用CSS來控制輸入框的樣式。我們可以使用以下樣式屬性來控制輸入框：

/* 控制輸入框的寬度 */
#input-box {
width: 300px;
}
/* 控制輸入框的邊框 */
#input-box {
border: 1px solid #ccc;
}
/* 控制輸入框的內邊距 */
#input-box {
padding: 10px;
}
/* 控制輸入框的字體和顏色 */
#input-box {
font-family: Arial, sans-serif;
font-size: 16px;
color: #333;
}
/* 控制輸入框的背景顏色 */
#input-box {
background-color: #fff;
}
/* 控制輸入框的圓角 */
#input-box {
border-radius: 5px;
}

以上屬性都是控制輸入框的基本屬性，我們可以根據需求進行修改。如果需要控制輸入框的偽類樣式，如:hover或:focus，可以使用以下樣式：

/* 控制輸入框的懸停狀態 */
#input-box:hover {
border-color: #999;
}
/* 控制輸入框的焦點狀態 */
#input-box:focus {
border-color: #0078d7;
box-shadow: 0 0 5px rgba(0, 120, 215, 0.5);
}

上述代碼會將輸入框在懸停狀態時的邊框顏色修改為#999，同時在焦點狀態時修改邊框顏色為#0078d7，并添加一個陰影效果。

總之，使用CSS控制輸入框樣式非常簡單，只需要了解基本樣式屬性和偽類樣式即可。希望本文對各位前端開發人員有所幫助。