input表單怎么制作多行文本輸入框

input表單怎么制作多行文本輸入框？這個(gè)問(wèn)題可能是我們?nèi)粘W(xué)習(xí)或工作經(jīng)常見(jiàn)到的。希望通過(guò)這個(gè)問(wèn)題能讓你收獲頗深。下面是小編給大家?guī)?lái)的參考內(nèi)容，讓我們一起來(lái)看看吧！

創(chuàng)新互聯(lián)是一家集網(wǎng)站建設(shè),卓資企業(yè)網(wǎng)站建設(shè),卓資品牌網(wǎng)站建設(shè),網(wǎng)站定制,卓資網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷(xiāo),網(wǎng)絡(luò)優(yōu)化,卓資網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力?？沙浞譂M(mǎn)足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專(zhuān)業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶(hù)成長(zhǎng)自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

一、首先我們來(lái)看看如何制作文本框：

<form action="url地址" method=“get/post” name="表單名稱(chēng)">
<p>這是文本框</p>
用戶(hù)名：<input type="text" name="username">

這樣的一個(gè)基本的用戶(hù)名的文本框就出來(lái)了，我們來(lái)看看效果：

如上圖就是一個(gè)用戶(hù)名的輸入框，是不是很熟悉，很多網(wǎng)站都有這個(gè)的，不過(guò)他們添加了很多別的元素讓表單變的更漂亮了，這個(gè)以后我們會(huì)學(xué)到的。(想看更多就去創(chuàng)新互聯(lián)html在線(xiàn)視頻課程)

二、現(xiàn)在我們?cè)賮?lái)說(shuō)說(shuō)如何制作密碼框：

我們知道密碼是個(gè)人隱私，每個(gè)人都不希望自己的密碼在自己輸入的時(shí)候被別人看見(jiàn)，所以基本上所有網(wǎng)站的密碼框內(nèi)輸入的密碼都是保密的，一輸入就是以星號(hào)或者以小圓點(diǎn)的方式顯示。

現(xiàn)在讓我們來(lái)看看這種input標(biāo)簽的密碼框是如何制作的吧。

<form action="url地址" method=“get/post” name="表單名稱(chēng)">
<p>這是文本框</p>
用戶(hù)名：<input type="text" name="username"></br>
密&nbsp;&nbsp;&nbsp;碼：<input type="password" name="password">

如上面代碼，我們應(yīng)該能猜到這是干什么的吧，先看看效果圖再說(shuō)：

你看，如果沒(méi)有那三個(gè)空格符，密碼和用戶(hù)名就會(huì)不對(duì)齊，一般都是用層疊樣式表來(lái)對(duì)齊的，但是現(xiàn)在我們只講HTML，現(xiàn)在還不說(shuō)css,所以現(xiàn)在我用了三個(gè)空格符來(lái)把密碼和用戶(hù)名對(duì)齊，這也是最簡(jiǎn)單的辦法。

可能是因?yàn)樾【幱袕?qiáng)迫癥吧，不管怎么說(shuō)，這樣的效果才是任何人都能看的，如果沒(méi)有對(duì)齊，就難看了很多。

三、密碼框看完了，現(xiàn)在我們來(lái)看看單選框如何的制作吧：

我們這里就以單選男女為例（當(dāng)然第三類(lèi)的就不說(shuō)了）

<form action="url地址" method=“get/post” name="表單名稱(chēng)">
<p>這是文本框</p>
用戶(hù)名：<input type="text" name="username"></br>
密&nbsp;&nbsp;&nbsp;碼：<input type="password" name="password">
<p>單選框</p>
單選：<input type="radio" name="sex" value="nan">男
      <input type="radio" name="sex" value="nv">女

這個(gè)來(lái)看看效果吧

這就是單選框，也是常用的框架吧，男和女只能選一個(gè)，不能兩個(gè)都選的。

四、有了單選框，那接下來(lái)就說(shuō)說(shuō)多選框吧：

<form action="url地址" method=“get/post” name="表單名稱(chēng)">
<p>這是文本框</p>
用戶(hù)名：<input type="text" name="username"></br>
密&nbsp;&nbsp;&nbsp;碼：<input type="password" name="password">
<p>單選框</p>
單選：<input type="radio" name="sex" value="nan">男
      <input type="radio" name="sex" value="nv">女
<p>多選框</p>
多選：<input type="checkbox" name="n">吃飯
      <input type="checkbox" name="n">睡覺(jué)
      <input type="checkbox" name="n">打豆豆
      <input type="checkbox" name="n">喝水

效果如圖

這圖把上面的東西都選上了，多選框是都能選上，當(dāng)然還可以設(shè)置默認(rèn)選擇一個(gè)的，只需要加checked=“checked”這個(gè)屬性，在哪個(gè)多選框內(nèi)添加都能在網(wǎng)頁(yè)中一刷新就能顯示出來(lái)，這就是默認(rèn)選中的效果。

五、說(shuō)了這么多，接下來(lái)就說(shuō)說(shuō)最后的提交按鈕和重置按鈕吧：

這兩個(gè)都是非常重要的按鈕，重置按鈕能把你網(wǎng)頁(yè)上選中或者填寫(xiě)的東西一鍵恢復(fù)原樣。提交是把你所有填寫(xiě)和選中的都提交給后臺(tái)。下面來(lái)看代碼：

<form action="url地址" method=“get/post” name="表單名稱(chēng)">
<p>這是文本框</p>
用戶(hù)名：<input type="text" name="username"></br>
密&nbsp;&nbsp;&nbsp;碼：<input type="password" name="password">
<p>單選框</p>
單選：<input type="radio" name="sex" value="nan">男
      <input type="radio" name="sex" value="nv">女
<p>多選框</p>
多選：<input type="checkbox" name="n">吃飯
      <input type="checkbox" name="n">睡覺(jué)
      <input type="checkbox" name="n">打豆豆
      <input type="checkbox" name="n">喝水
<p>重置按鈕</p>
重置：<input type="reset" name="">
<p>提交按鈕</p>
提交：<input type="submit" name="">

由于沒(méi)有后臺(tái)，所以就沒(méi)填寫(xiě)后臺(tái)地址了。不過(guò)不影響效果

這就是一個(gè)頁(yè)面的填寫(xiě)注冊(cè)的大部分窗口了吧，都很簡(jiǎn)單，上面的好多都是以固定的形式出現(xiàn)的，還有個(gè)別的屬性在以后也會(huì)慢慢了解到。

感謝各位的閱讀！看完上述內(nèi)容，你們對(duì)input表單怎么制作多行文本輸入框大概了解了嗎？希望文章內(nèi)容對(duì)大家有所幫助。如果想了解更多相關(guān)文章內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

分享題目：input表單怎么制作多行文本輸入框
文章起源：http://muchs.cn/article0/pdjioo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供小程序開(kāi)發(fā)、建站公司、網(wǎng)站設(shè)計(jì)、做網(wǎng)站、全網(wǎng)營(yíng)銷(xiāo)推廣、ChatGPT

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)