HTML如何制作表单(Axure如何制作点击弹框效果)
生活随笔
收集整理的這篇文章主要介紹了
HTML如何制作表单(Axure如何制作点击弹框效果)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
本教程操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。
HTML 表單
- 用于收集不同類型的用戶輸入。
- 表單是一個包含表單元素的區域
- 表單元素是允許用戶在表單中輸入內容, 比如：文本域(textarea)、下拉列表、單選框(radio-buttons)、復選框(checkboxes)等等
- 表單使用表單標簽 來設置
HTML 表單-輸入元素
- 多數情況下被用到的表單標簽是輸入標簽（input）。
- 輸入類型是由類型屬性（type）定義的。
文本域（Text Fields）
<form> <h3>用戶注冊頁面</h3> 用戶名:<input name = "username "type = "text"><br /> </form>
登錄后復制
密碼字段
<form> 密碼:<input name = "passwd1" type="password"><br /> 確認密碼:<input name = "passwd2" type = "password"><br /> </form>
登錄后復制
單選按鈕（Radio Buttons）
<form>
性別:<input name = "sex" value = "1" type = "radio" >男
<input name = "sex" value = "0" type = "radio" checked = "checked">女<br />
</form>
登錄后復制
復選框（Checkboxes)
<form>
愛好:<input name = "hobby" type = "checkbox" value="吃飯">吃飯
<input name = "hobby" type = "checkbox" value="睡覺">睡覺
<input name = "hobby" type = "checkbox" value="打游戲">打游戲<br />
</form>
登錄后復制
簡單的下拉列表
<form> 出生日期: <select name = "year" > <option value="2019">2019</optiom> <option value="2018">2018</optiom> <option value="2017">2017</optiom> <option value="2016">2016</optiom> </select> <select name = "month"> <option value="1">1</optiom> <option value="2">2</optiom> <option value="3">3</optiom> <option value="4">4</optiom> <option value="5">5</optiom> <option value="6">6</optiom> <option value="7">7</optiom> <option value="8">8</optiom> <option value="9">9</optiom> </select> <select name = "day"> <option value="1">1</optiom> <option value="2">2</optiom> <option value="3">3</optiom> <option value="4">4</optiom> <option value="5">5</optiom> <option value="6">6</optiom> <option value="7">7</optiom> <option value="8">8</optiom> <option value="9">9</optiom> </select> </form>
登錄后復制
重置
<form> <input type="reset" value="重置"> </form>
登錄后復制
提交按鈕(Submit Button)
<input type="submit" value="同意以下服務協議，提交注冊信息">
登錄后復制
文本域(Textarea)
<textarea name="wenben"></textarea>
登錄后復制
完整代碼
<html> <head> <title>注冊頁面</title> <meta charset="utf-8"> </head> <body> <form action="#" method="post" enctype="multiple/form-data" > <h3>用戶注冊頁面</h3> 用戶名:<input name = "username"type = "text"><br /> <!--頭像上傳<input type="file" name="photos"><br />--> 密碼:<input name = "passwd1" type="password"><br /> 確認密碼:<input name = "passwd2" type = "password"><br /> 性別:<input name = "sex" value = "1" type = "radio" >男 <input name = "sex" value = "0" type = "radio" checked = "checked">女<br /> 愛好:<input name = "hobby" type = "checkbox" value="吃飯">吃飯 <input name = "hobby" type = "checkbox" value="睡覺">睡覺 <input name = "hobby" type = "checkbox" value="打游戲">打游戲<br /> 出生日期: <select name = "year" > <option value="2019">2019</optiom> <option value="2018">2018</optiom> <option value="2017">2017</optiom> <option value="2016">2016</optiom> </select> <select name = "month"> <option value="1">1</optiom> <option value="2">2</optiom> <option value="3">3</optiom> <option value="4">4</optiom> <option value="5">5</optiom> <option value="6">6</optiom> <option value="7">7</optiom> <option value="8">8</optiom> <option value="9">9</optiom> </select> <select name = "day"> <option value="1">1</optiom> <option value="2">2</optiom> <option value="3">3</optiom> <option value="4">4</optiom> <option value="5">5</optiom> <option value="6">6</optiom> <option value="7">7</optiom> <option value="8">8</optiom> <option value="9">9</optiom>AA </select> <br /> <input type="reset" value="重置"> <input type="submit" value="同意以下服務協議，提交注冊信息"> <br /> <textarea name="wenben"> </textarea> <input type="hidden" name="token" value="cbff36039c3d0212b3e34c23dcde1456"> </form> </body> </html>
登錄后復制
實驗結果
【推薦學習：Html5教程】
以上就是HTML如何制作表單的詳細內容，更多請關注風君子博客其它相關文章！
總結
以上是生活随笔為你收集整理的HTML如何制作表单(Axure如何制作点击弹框效果)的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 区块链不适用的若干场景
- 下一篇： hadoop配置2.6.1 centos