網站的登錄或注冊頁面，用戶名一欄使用的一般為單行文本框。

在 HTML 中，把 <input> 標簽的 type 屬性設置為 text 可以表示單行文本框，又叫做常規文本框。具體語法格式如下：

<input type="text" />

接下來我們看一個具體的例子：

<form action="" method="post" name="myForm">用戶名:<input type="text" name="username" value="打工人"/> </form>

運行效果如圖所示：

通過運行結果可以發現，文本框中的值為定義的 value 屬性的值。當需要告知用戶某一欄數據時，我們通常這樣寫。如果只是想獲取用戶輸入的數據，通常不設置 value 屬性值，由用戶自行輸入。

注意：文本框的默認數據用戶可以進行刪除、修改，也可以讓它繼續保持現有值，提交時會按照文本框現有內容進行提交。

當 <input> 標簽作為單行文本框使用時，除了 value 屬性還可能用到以下兩個屬性：

1) maxlength屬性

在 表單中，允許使用 maxlength 屬性設置文本框中最多可以輸入的字符數量（包括空格）。如果我們要對年齡輸入框設置，可以這樣寫：

<form action="" method="post" name="myForm">年齡:<input type="text" name="age" maxlength="3" /> </form>

我們都知道，年齡沒有超過三位數的，所以我們為年齡文本框設置最多可以輸入 3 字符，當用戶輸入第 4 個字符時，不再允許輸入。

2) size屬性

size 屬性用來定義文本框可見的字符數。可以這樣使用：

<form action="" method="post" name="myForm">年齡:<input type="text" name="age" size="3" /> </form>

與 maxlength 不同的是，size 定義的是文本框可見的字符數，當用戶輸入的字符數超出這個值時，還可以輸入只是不再顯示。

我們不建議為文本框設置 size 屬性，目前很少有人這么做。如果需要，應該使用 CSS 設置文本框的寬度。

總結

以上是生活随笔為你收集整理的15、HTML单行文本框的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。