網(wǎng)站的登錄或注冊(cè)頁(yè)面，用戶名一欄使用的一般為單行文本框。

在 HTML 中，把 <input> 標(biāo)簽的 type 屬性設(shè)置為 text 可以表示單行文本框，又叫做常規(guī)文本框。具體語(yǔ)法格式如下：

<input type="text" />

接下來(lái)我們看一個(gè)具體的例子：

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

運(yùn)行效果如圖所示：

通過(guò)運(yùn)行結(jié)果可以發(fā)現(xiàn)，文本框中的值為定義的 value 屬性的值。當(dāng)需要告知用戶某一欄數(shù)據(jù)時(shí)，我們通常這樣寫(xiě)。如果只是想獲取用戶輸入的數(shù)據(jù)，通常不設(shè)置 value 屬性值，由用戶自行輸入。

注意：文本框的默認(rèn)數(shù)據(jù)用戶可以進(jìn)行刪除、修改，也可以讓它繼續(xù)保持現(xiàn)有值，提交時(shí)會(huì)按照文本框現(xiàn)有內(nèi)容進(jìn)行提交。

當(dāng) <input> 標(biāo)簽作為單行文本框使用時(shí)，除了 value 屬性還可能用到以下兩個(gè)屬性：

1) maxlength屬性

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

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

我們都知道，年齡沒(méi)有超過(guò)三位數(shù)的，所以我們?yōu)槟挲g文本框設(shè)置最多可以輸入 3 字符，當(dāng)用戶輸入第 4 個(gè)字符時(shí)，不再允許輸入。

2) size屬性

size 屬性用來(lái)定義文本框可見(jiàn)的字符數(shù)?？梢赃@樣使用：

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

與 maxlength 不同的是，size 定義的是文本框可見(jiàn)的字符數(shù)，當(dāng)用戶輸入的字符數(shù)超出這個(gè)值時(shí)，還可以輸入只是不再顯示。

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

總結(jié)

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

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。