HTML表单

2020-02-25 15:58:14 阅读：200 来源： 互联网

1. 表单标签

表单标签：用于采集用户输入的数据，和服务器交互(form标签)

表单项中的数据如果想要被提交必须指定name属性,才可以提交

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <!--<img src="img/c1.png"/>-->
        <!--
            将<form>标签放在<input>属性外：
                action:指定提交数据的url
                method:指定提交方式
                    为http响应的
                        get:
                        post:
                表单项中的数据如果想要被提交必须指定name属性,才可以提交
        -->
        <!--
            input:可以通过type属性值，改变元素展示样式
                type属性：
                    1.text:文本输入框，如果不输入type，则默认为text
                    2.password:密码框
                    3.radio:单选框
                        1.要想实现单选，则name属性值必须一样
                        2.给每个单选框提供value属性，指定其被选中后提交的值
                        3.通过check属性可以指定默认值)
                    4.checkbox:复选框
                        1.给每个单选框提供value属性，指定其被选中后提交的值
                        (单选框与复选框的check属性可以指定默认值)
                    5.file:上传文件
                    6.hidden:隐藏域，用来提交信息
                        value值为信息。
                    7.按钮:
                        1.button:
                        2.submit:提交表单信息
                        3.<image>:图标提交属性
                    8.date(datetime):
                    9.email:
                value属性：显示提示字
                placeholder属性：显示提示信息，当要输入时清空提示信息
            select:下拉列表
                option指定列表项
            textarea:文本域    
                cols:指定列数，每一行的字符数
                rows:指定行数
            
        -->
        <form action = "#" method="get">
            
        用户名(文本输入框): <input type="text" name="username" value="请输入账号"/>
                <br />
        密码(密码框): <input type="password" name="password" placeholder="请输入密码"/>
                <br />
        性别(单选框):　<input type="radio" name="gender" value="male" checked="checked"/>男
                <input type="radio" name="gender" value="female"/>女
                <br />
        爱好(复选框)：　<input type="checkbox" name="hoppy" value="one"/>爱好一
                <input type="checkbox" name="hoppy" value="two"/>爱好二
                <input type="checkbox" name="hoppy" value="three"/>爱好三
                <br />
        选择文件(文件框): <input type="file" name="file"/>
                <br />
        隐藏域: <input type="hidden" name="HiddenData" value="yincangyu"/>
                <br />
        日期： <input type="date" name=""/>
                <br />
        下拉列表：<select name="xialaleibiao">
                    <option value="1">11</option>
                    <option value="2">22</option>
                    <option value="3" selected="selected">33</option>
                </select>
                <br />
        文本域：<textarea cols="20" name="wenben"></textarea>
                <br />
        提交表单信息：     <input type="submit" id="" value="登陆" />
        </form>
    </body>
</html>

标签：标签,爱好,指定,表单,HTML,提交,属性
来源： https://www.cnblogs.com/innndown/p/12362089.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

HTML表单

1. 表单标签