表格、表单标签

发布时间 2023-04-08 09:10:03作者: 流浪猫老大

表格标签

<!--表格-->html
<table border="1"  cellspacing="0" width="400" align="center">

    <tr align="center">
        <th>A</th>
        <th>B</th>
        <th>C</th>
        <th>D</th>
    </tr>
    <tr align="center">
        <td>a</td>
        <td>b</td>
        <td>c</td>
        <td>d</td>
    </tr>
    <tr align="center">
        <td>a</td>
        <td>b</td>
        <td>c</td>
        <td>d</td>
    </tr>
    <tr>
        <td>a</td>
        <td>b</td>
        <td>c</td>
        <td>d</td>
    </tr>


</table>

表单标签

image

<!--表单-->

<form action="" method="post">
    用户名:<input type="text" name="username"><br><br>
    密码:<input type="password" name="password"><br><br>
    性别:<!--同一组name必须一致-->
    <!--label标签点击标签内任何元素该项也能被选中-->
    <label> <input type="radio" name="gender" value="1"> 男 </label>
    <label> <input type="radio" name="gender" value="2"> 女 </label><br><br>
    <!--value为选中该选项后地址栏中提交的数据-->
    爱好:<label><input type="checkbox" name="hobby" value="java">java</label>
         <label><input type="checkbox" name="hobby" value="C++">C++</label>
         <label><input type="checkbox" name="hobby" value="Python">Python</label>
         <label><input type="checkbox" name="hobby" value="Hadoop">Hadoop</label>
    <br><br>
    图像:<input type="file" name="image"><br><br>   <!--通常用于文件上传-->
    生日:<input type="date" name="birthday"><br><br><!--年月日-->
    时间:<input type="time" name="time"><br><br><!--时分-->
    日期时间:<input type="datetime-local" name="datetime"><br><br><!--年月日时分-->
    邮箱:<input type="email" name="email"><br><br>
    年龄:<input type="number" name="age"><!--只能输入数字-->
    <br><br>
    <!--下拉列表-->
    学历:<select name="degree">
            <option value="">------------请选择------------</option>
            <option value="1">大专</option>
            <option value="2">本科</option>
            <option value="3">硕士</option>
            <option value="4">博士</option>
        </select>
    <br><br>
    <!--文本域
    cols:一行可输入多少个字
    可输入多少行
    -->
    描述:<textarea name="description" cols="30" rows="10"></textarea>      <br><br>
    <!--隐藏域
    页面看不到,但是会提交
    -->
    <input type="hidden" name="id" value="1">
    <br><br>
    <!--表单常见按钮-->
    <input type="submit" value="提交">
    <input type="button" value="按钮"> <!--配合javascript事件使用-->
    <input type="reset" value="重置">
    <br><br>

</form>