1. <!DOCTYPE html >
    2. <html>
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    5. <title>表单标签</title>
    6. </head>
    7. <body>
    9.     <form name="myform" action="#" method="post">
    11.         <table>
    13.             <tr>
    14.                 <td>
    15.                     姓名
    16.                 </td>
    17.                 <td>
    18.                     <input type="text" name="username" value="李四">
    19.                 </td>
    20.             </tr>
    21.             <tr>
    22.                 <td>
    23.                     密码
    24.                 </td>
    25.                 <td>
    26.                     <input type="password" name="password" value="">
    27.                 </td>
    28.             </tr>
    29.             <tr>
    30.                 <td>
    31.                     性别
    32.                 </td>
    33.                 <td>
    34.                     <input type="radio" name="sex" value="male">男
    35.                     <input type="radio" name="sex" value="female" checked="checked">女
    36.                 </td>
    37.             </tr>
    38.             <tr>
    39.                 <td>
    40.                     爱好
    41.                 </td>
    42.                 <td>
    43.                     <input type="checkbox" name="hobby"  value="football" >足球
    44.                     <input type="checkbox" name="hobby"  value="baskerball" checked="checked">篮球
    45.                     <input type="checkbox" name="hobby"  value="paiqiu">排球
    46.                 </td>
    47.             </tr>
    48.             <!-- 下拉列表 -->
    49.             <tr>
    50.                 <td>
    51.                     地址
    52.                 </td>
    53.                 <td>
    54.                     <select name="city"><!-- city=tj -->
    55.                         <option value="bj">北京</option>
    56.                         <option value="sh">上海</option>
    57.                         <option value="tj" selected="selected">天津</option>
    58.                     </select>
    60.                 </td>
    61.             </tr>
    62.             <tr>
    63.                 <td>
    64.                     上传头像
    65.                 </td>
    66.                 <td>
    67.                     <input type="file" name="file">
    68.                 </td>
    69.             </tr> 
    71.             <!-- 文本域 -->
    72.              <tr>
    73.                 <td>
    74.                     备注
    75.                 </td>
    76.                 <td>
    77.                     <textarea name="remark" cols="30" rows="10">好好学习</textarea>
    78.                 </td>
    79.             </tr>
    81.             <tr>
    82.                 <td></td>
    83.                 <td>
    84.                     <input type="submit"  value="提交">
    85.                     <input type="button"  value="button">
    86.                     <input type="reset"  value="reset">
    87.                     <input type="image" src="images/btn.gif" alt="图片">
    88.                     <input type="hidden" name="hide" value="monkey1024">
    89.                 </td>
    90.             </tr>
    92.         </table>
    94.     </form>
    96. </body>
    97. </html>

    标签说明：
    这一节中的标签比较重要，在开发中会经常用到

    1、form标签：


    属性：
    name:表单名称
    action:提交的路径地址
    method:提交方式（get，post，put，delete），其中get和post使用的多，如果不明确指出，则默认使用get方式。

    1.     get和post的区别：<br />            (1)get提交将数据加在地址栏的后面，格式?name=value&name=value；post提交将数据封装在请求体中<br />                ?username=zhangsan&password=123&sex=male&hobby=football&hobby=basketball&city=tj#<br />            (2)get提交相对不安全；post提交相对安全<br />            (3)get提交有大小限制，根据浏览器不同而不同；post不限制大小

    2、input标签：
    type属性:根据type属性实现各种不同功能的表单项；
    text：普通的文本输入框；
    name：username value=”张三”
    password：密码输入框；特点是显示的是掩码
    radio：单选按钮
    name：如果想让一组单选按钮互斥，就用指定同意name属性值，需要加value属性值；
    checked：默认被选中；
    checkbox：复选框；
    name：组的概念，需要加value属性值。
    checked：默认被选中；
    file：上传文件的控件
    button：普通按钮，没有任何内置的功能；
    submit：内置功能，点击会按照action地址提交
    reset：重置，点击会清空之前填写的内容
    image：图片按钮，功能类似与submit
    src：加载图片
    alt:图片的提示文字
    hidden:隐藏表单，作用是在提交数据的时候，服务器需要这个数据，但是不需要用户看到。

    1. 注意：name属性必须要写。

    3、select标签()：下拉菜单
    属性：
    name;表单项的名称
    option标签：可选项（下拉菜单之间的级联）
    属性：
    value，表单项的值
    selected：默认被选中

    4、textarea:文本域标签
    属性：
    cols：列数
    rows：行数
    注意：默认的文本值在标签体当中