• 技术文章 >web前端 >H5教程

    HTML5属性:form表单属性的用法实例

    不言不言2018-08-09 14:57:12原创1546
    这篇文章给大家介绍的内容是关于HTML5属性:form表单属性的用法实例,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>表单</title>
    </head>
    <body>
    <!-- 表单
    action:提交的网址 默认是当前的网址; 自定义
    method: 默认:get / post
    -->
    <form action="" method="post">
    <p>
    <!-- 1.用户名 -->
    <label for="">用户名:</label>
    <input id="xx" type="text" placeholder="请输入" name="username">
    </p>
    <p>
    <!-- 2.密码 -->
    <label for="">密&nbsp;&nbsp;&nbsp;&nbsp;码:</label>
    <input type="password" name="pwd">
    </p>
    <p>
    <!-- 3.性别 -->
    <label for="">性&nbsp;&nbsp;&nbsp;&nbsp;别:</label>
    <input type="radio" name="sex" value="0">男
    <input type="radio" name="sex" value="1">女
    </p>
    <p>
    <!-- 4.爱好 -->
    <label for="">爱&nbsp;&nbsp;&nbsp;&nbsp;好:</label>
    <input type="checkbox" name="like" value="0">妹子
    <input type="checkbox" name="like" value="1">汉子
    <input type="checkbox" name="like" value="2">健身
    <input type="checkbox" name="like" value="3">游泳
    </p>
    <p>
    <!-- 5.上传文件 -->
    <label for="">玉&nbsp;&nbsp;&nbsp;&nbsp;照:</label>
    <input type="file" name="file">
    </p>
    <p>
    <!-- 6.下拉列表 -->
    <label for="">籍&nbsp;&nbsp;&nbsp;&nbsp;贯:</label>
    <select name="address" id="">
    <option value="0">北京</option>
    <option value="1">上海</option>
    <option value="2">广东</option>
    <option value="3" selected="selected">深圳</option>
    </select>
    </p>
    <p>
    <!-- 7.文本域 -->
    <label for="">个人描述:</label>
    <textarea name="info" id="" cols="30" rows="10"></textarea>
    </p>
    <p>
    <!-- 8.注册 -->
    <input type="submit" value="注册">
    <!-- 9.重置 -->
    <input type="reset">
    <!-- 10.隐藏域 -->
    <input type="hidden" name="isVIP" value="yes">
    <!-- 11.普通按钮 -->
    <input type="button" value="普通按钮">
    </p>
    </form>
    </body>
    </html>

    运行效果如下:

    2345截图20180809145559.png

    相关文章推荐:

    html5的video(视频)和audio(音频)标签中的属性用法

    HTML5的option属性:如何使用option属性实现级联下拉列表

    以上就是HTML5属性:form表单属性的用法实例的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:HTML5属性
    上一篇:html5的video(视频)和audio(音频)标签中的属性用法 下一篇:HTML5中div标签的实例代码
    PHP编程就业班

    相关文章推荐

    • html5离线存储有哪些• 深入解析asp.net中mvc4自定义404页面(分享)• h5新增标签audio与video的使用• 你值得了解的HTTP缓存机制(代码详解)• 避免常见的六种HTML5错误用法 (5-6)

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网