<form action="">
    <!--專業：
    <select name="" id="">
        <option value="1">前端與移動開發</option>
        <option value="2">java</option>
        <option value="3">javascript</option>
        <option value="4">c++</option>
    </select>-->
    <!--不僅可以選擇，還應該可以輸入-->
    <!--建立輸入框與datalist的關聯  list="datalist的id號"-->
    專業：<input type="text" list="subjects"> <br>     <!--=============== list==》 id =================-->
    <!--通過datalist建立選擇列表-->
    <datalist id="subjects">    <!--=============== id =================-->
        <!--建立選項值：value:具體的值 label:提示資訊，輔助值-->
        <!--option可以是單標籤也可以是雙標籤-->
        <option value="英語" label="不會"/>
        <option value="前端與移動開發" label="前景非常好"></option>
        <option value="java" label="使用人數多"></option>
        <option value="javascript" label="做特效"></option>
        <option value="c" label="不知道"></option>
    </datalist>

    網址：<input type="url" list="urls">
    <datalist id="urls">
        <!--如果input輸入框的type型別是url,那麼value值必須新增http://-->
        <option value="http://www.baidu.com" label="百度"></option>
        <option value="http://www.sohu.com" label="搜狐"></option>
        <option value="http://www.163.com" label="163"></option>
    </datalist>
</form>




<form action="">
    使用者名稱：<input type="text" name="userName"><br>
    密碼：<input type="password" name="userPwd"> <br>
    加密：<keygen></keygen><br>
    <input type="submit">
</form>

<!--顯示輸出資訊：只能顯示不能修改
1.語義性更強
2.值需要你去設定，不能自動計算-->
<output>總金額：￥100.00</output>