在前端頁面中，輸入框（input）是很常見的控件之一。如何控制輸入框的長度呢？CSS提供了多種方式來實現。
首先，我們可以使用width屬性，設置輸入框的寬度。例如，下面的代碼將輸入框的寬度設置為200px：

input {
width: 200px;
}

其次，我們可以使用max-width屬性，同時配合box-sizing屬性來控制輸入框的最大寬度。例如，下面的代碼將輸入框的最大寬度設置為300px：

input {
max-width: 300px;
box-sizing: border-box;
}

此時，如果輸入框的寬度超過了300px，輸入框會顯示滾動條，而不是撐破其所在的容器。
另外，我們還可以使用text-overflow屬性，來控制輸入框內容的溢出情況。例如，下面的代碼將輸入框內容超出部分顯示為省略號：

input {
width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

此時，如果輸入框內容超出了寬度200px，超出部分會被隱藏，并顯示省略號。
綜上所述，控制輸入框的長度是前端頁面開發中必不可少的一部分。我們可以通過width、max-width、text-overflow等CSS屬性來實現，讓輸入框顯示的更清晰、美觀。