HTML表单

DRF满天星辰

已于 2023-08-09 22:07:10 修改

阅读量29

点赞数

文章标签： html5

于 2023-07-10 22:06:25 首次发布

本文链接：https://blog.csdn.net/m0_74797753/article/details/131648215

版权

1.表单域

<form action="url地址" method=“提交方式” name=“表单域名称”>

   各种表单元素控件

</form>

2.<imput>表单元素

  <imput type="属性值">

属性值type=" "

text （文本默认20）

password (掩盖密码字符）

radio （单选按钮）

checkbox （多选按钮）

submit （提交表单）

reset （重置填写内容）

button （自定义按钮）

file （上传文件按钮）

image （上传图像）

hiddle （定义隐藏字段）

3.label标签

  <input type="radio" name="sex" id="sex"/>

  <label for="sex">男</label>

4.select下拉表单

 <select>
     <option>选项1</option>
     <option>选项2</option>
     <option>选项3</option>
</select>

5.textarea（类似文本框）

<textarea rows=" "cols=" ">
</textarea>

6.实例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h4>注册表<h4>
            <table width="500" border="1">
                <tr>
                    <td>性别:</td>
                    <td>
                        <input type="radio" name="sex" id="nan" checked="checked"><label for="nan">男</label>
                        <input type="radio" name="sex" id="nv"><label for="nv">女</label>
                    </td>
                </tr>

                <tr>
                    <td>生日：</td>
                    <td>
                        <select>
                            <option>--请选择年份--</option>
                            <option>2000</option>
                            <option>2001</option>
                            <option>2002</option>
                            <option>2003</option>
                            <option>2004</option>
                        </select>

                        <select>
                            <option>--请选择月份--</option>>
                            <option>1</option>
                            <option>2</option>
                            <option>3</option>
                            <option>4</option>
                            <option>5</option>
                        </select>
                    </td>

                </tr>

                <tr>
                    <td>所在地区：</td>
                    <td><input type="text" value="湖北"></td>
                </tr>

                <tr>
                    <td>爱好：</td>
                    <td>
                        <input type="checkbox" name="爱好">打球
                        <input type="checkbox" name="爱好">听音乐
                        <input type="checkbox" name="爱好">看视频
                        <input type="checkbox" name="爱好">看小说
                        <input type="checkbox" name="爱好">打游戏
                    </td>
                </tr>

                <tr>
                    <td>自我介绍</td>
                    <td>
                        <textarea>个人简介</textarea>
                    </td>
                </tr>

                <tr>
                    <td></td>
                    <td>
                        <input type="submit" value="免费注册">
                    </td>
                </tr>

                <tr>
                    <td></td>
                    <td>
                        <input type="radio" checked="checked">我同意注册条款和会员加入标准
                    </td>
                </tr>

                <tr>
                    <td></td>
                    <td>
                        <a href="#">已注册，立即登录
                    </td>
                </tr>

                <tr>
                    <td></td>
                    <td>
                        <ul>
                            <h5>我承诺</h5>
                            <li>信息真实</li>
                            <li>年满18</li>
                        </ul>
                    </td>
                </tr>

</body>

</html>