HTML筆記--表單標(biāo)簽

標(biāo)簽（空格分隔）： HTML

表單標(biāo)簽(****最重要的一個(gè)標(biāo)簽*****)

• 可以用來(lái)實(shí)現(xiàn)登錄頁(yè)面
• 標(biāo)簽形式：<form></form>定義一個(gè)表單，所有的表單的內(nèi)容定義在這兩個(gè)標(biāo)簽內(nèi)部；
  • 屬性：提交地址 action = "提交的地址"
  • 提交方式：method="get/post"
  • 兩種提交方式的區(qū)別：（面試題）
    • get請(qǐng)求地址欄會(huì)攜帶提交的數(shù)據(jù)，post的不會(huì)攜帶；
    • get的安全級(jí)別較低，post較高
    • get請(qǐng)求有數(shù)據(jù)大小的限制，post沒(méi)有限制
  • enctype：一般請(qǐng)求不需要這個(gè)屬性，但是在文件上傳到哦時(shí)候會(huì)需要這個(gè)屬性。
• 輸入項(xiàng)：
  • 大部分輸入項(xiàng)可以使用<input type = "輸入項(xiàng)類型"/> 來(lái)制定；
  • 普通輸入項(xiàng)：如用戶名；<input type = "text"/>
    • 代碼：<form><input type = "text"/> </form>
  • 密碼輸入項(xiàng)：<input type="password"/> 效果是不顯示在頁(yè)面上而顯示黑點(diǎn)；
  • 單選輸入項(xiàng)：<input type="radio"/>
    • 必須在定義的時(shí)候 添加name屬性 如果有多個(gè)選項(xiàng)，那么name的屬性值必須一樣否則會(huì)成為多選；
    • 還必須指定value屬性，否則在提交（get/post）表單時(shí)該項(xiàng)內(nèi)容無(wú)法被正確提交。
    • 代碼<input type="password" name="sex" value="wm"/>女
<input type="password" name="sex" value="m"/>男
    • 實(shí)現(xiàn)默認(rèn)選中：checked="checked"屬性
  • 多選輸入框：
    • 同遵循單選框的name和value規(guī)則
    • 實(shí)現(xiàn)默認(rèn)選中：checked="checked"屬性
    • 代碼：<input type="checkbox" name="love" value="ym"/>羽毛球``<input type="password" name="love" value="pp"/>羽毛球
  • 文件輸入項(xiàng)：<input type="file">
    • 該屬性在后面將會(huì)仔細(xì)講到
  • 下拉輸入項(xiàng)：（不是在input標(biāo)簽內(nèi)）
    • <select><option></option></select>
    • select表示一個(gè)下拉輸入框：必須指定一個(gè)name屬性如<select name="birth">
    • option表示一個(gè)選項(xiàng)：他必須指定一個(gè)value的屬性如：<option value="1991">1991</option>
    • 默認(rèn)選中：selected="selected"默認(rèn)選中
  • 文本域輸入項(xiàng):如添加一個(gè)自我描述的輸入框：
    • 例子<textarea cols="列數(shù)" rows="行數(shù)"></textarea>
  • 隱藏項(xiàng)：存在于代碼卻不顯示在界面
    -<input type="hidden"/>
  • 提交按鈕：
    • `<input type=" submit" value="按鈕上的文字"/>
    • 提交方式和地址；這兩個(gè)屬性需要在form標(biāo)簽中作為屬性設(shè)置；
  • 使用圖片提交：
    • <input type="image" src="圖片地址">
  • 重置按鈕：
    -回到初始狀態(tài) <input type="reset" vlaue="顯示文字"/>
  • 普通按鈕：
    • <input type="button" vlaue="顯示文字">
    • 一般配合js作為監(jiān)聽(tīng)使用