[HTML]表單控件、iframe、datails、meter、time、fieldset、mark
阿新 • • 發佈：2017-05-04
單選 spa 多行 普通 -html tag sel legend doctype
語法：<label>文本</label> 屬性： for:表示與該元素相關聯的控件ID
一、表單元素
1.input：空標記 屬性： type:文本框、密碼框、單選按鈕、復選框 value:當前表單元素的值，可以是提交給服務器的值，也可以是默認顯示的初始值 name:名稱，要提交給server使用 id:唯一標識，只能在當前頁面使用，server不能用 disabled:禁用控件 文本框：<input type="text" /> 密碼框：<input type="password" /> 通用屬性：name,id,value，maxlength,readonly 單選按鈕：<input type="radio" /> 屬性：name：定義名稱、分組 value：值 checked1.提交按鈕：<inputtype="submit"value="提交"/>
2.重置按鈕：<inputtype="reset"value="重置"/>
3.普通按鈕：<inputtype="button"value="按鈕上的文字"/>
文件選擇框：<input type="file" />
註：如果有文件上傳，須將enctype改為multipart/form-data，method改為post
隱藏域：<input type="hidden" name="" value="" />
使用場合：在頁面中看不到，一般會配合後臺開發一起使用
2.下拉框：語法：<label>文本</label> 屬性： for:表示與該元素相關聯的控件ID
顯式的聯系：<labelfor="SSN">Social Security Number:</label><inputtype="text"name="SocSecNum"id="SSN"/>隱式的聯系：<label>Date of Birth: <inputtype="text"name="DofB"/></label>
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>復雜表單</title> 6 </head> 7 <body> 8 <h1>修改個人信息</h1> 9 <table border="1px" cellspacing="0" width="400px"> 10 <form> 11 <tr> 12 <td>姓名：</td> 13 <td> 14 <input type="text" name="uName" value="mary"/> 15 </td> 16 </tr> 17 <tr> 18 <td>性別：</td> 19 <td> 20 <input type="radio" id="female" name="gender" value="female" checked /><label for="female">女士</label> 21 <input type="radio" id="male" name="gender" value="male" /><label for="male">男士</label> 22 </td> 23 </tr> 24 <tr> 25 <td>學歷：</td> 26 <td> 27 <select name="education"> 28 <option value="高中">高中</option> 29 <option value="本科">本科</option> 30 <option value="碩士">碩士</option> 31 <option value="其他" selected>其他</option> 32 </select> 33 </td> 34 </tr> 35 <tr> 36 <td>意向工作城市：</td> 37 <td> 38 <select name="city" size="5" multiple> 39 <option value="BJ">北京</option> 40 <option value="SH">上海</option> 41 <option value="GZ">廣州</option> 42 <option value="SZ">深圳</option> 43 </select> 44 </td> 45 </tr> 46 <tr> 47 <td>個人描述：</td> 48 <td> 49 <textarea rows="4"></textarea> 50 </td> 51 </tr> 52 <tr> 53 <td></td> 54 <td> 55 <input type="checkbox" />不要公共我的個人信息 56 </td> 57 </tr> 58 <tr> 59 <td></td> 60 <td> 61 <input type="submit" value="保存" /> 62 <input type="reset" value="重填" /> 63 </td> 64 </tr> 65 </form> 66 </table> 67 </body> 68 </html>
二、其他H5標記 1.浮動框架：在一個browser中同時顯示多個頁面文檔 <iframe></iframe> 屬性： 1.src:引入的網頁路徑 2.width 3.height: 4.frameborder:邊框，設為0則無邊框
<iframesrc="04.html">該瀏覽器不支持iframe</iframe>
<details><summary>標題</summary><div>收縮/展開的內容</div></details>
<metermin="0"max="100"value="50"title="50%"></meter>
<timedatetime="時間值">顯示的文本</time>
<fieldset><legend>必填信息（組標題）</legend>用戶名：<inputtype="text"/><br/>密碼：<inputtype="password"/><br/></fieldset>
<mark>高亮顯示的文本</mark>
[HTML]表單控件、iframe、datails、meter、time、fieldset、mark