基本的表单控件还有html5的一些新的表单控件：

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <title></title>

</head>

<body>

    <fieldset>

        <legend>表单</legend>

        <form action="/" method="post">

            账号：<input type="text" name="name" value="" placeholder="请输入..." /><br /><br />

            密码：<input type="password" name="name" value="" maxlength="6" /><br /><br />

            性别：<input type="radio" name="sex" value="" />男&nbsp;&nbsp;<input type="radio" name="sex" value="" />女<br /><br />

            区域：<select>

                <option>北京</option>

                <option>上海</option>

                <option selected="selected">天津</option>

            </select><br /><br />

            分组：<select>

                <optgroup label="华北">

                    <option>北京</option>

                    <option selected="selected">天津</option>

                </optgroup>

                <optgroup label="华东">

                    <option>上海</option>

                    <option>江苏</option>

                </optgroup>

            </select><br /><br />

            多选：<input type="checkbox" name="name" value="" />体育&nbsp;&nbsp;<input type="checkbox" name="name" value="" />唱歌<br /><br />

            文件：<input type="file" name="file" value="" /><br /><br />

            数字：<input type="number" name="name" value="" step="5"/><br /><br />

            滑块：<input type="range" name="name" value="" step="3"/><br /><br />

            重置：<input type="reset" name="name" value="重置" /><br /><br />

            提交：<input type="submit" name="name" value="提交" />

        </form>

    </fieldset>

</body>

</html>

最后效果：

参考：HTML <input> 标签

html——表单控件的更多相关文章

  1. “此网页上的某个 Web 部件或 Web 表单控件无法显示或导入。找不到该类型，或该类型未注册为安全类型。”

    自从vs装了Resharper,看见提示总是手贱的想去改掉它.于是乎手一抖,把一个 可视web部件的命名空间给改了. 喏,从LibrarySharePoint.WebPart.LibraryAddEd ...

  2. MVC树控件,mvc中应用treeview，实现复选框树的多层级表单控件

    类似于多层级的角色与权限控制功能,用MVC实现MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件.最近我们的项目中需要用到树型菜单,以前使用WebForm时,树型菜单有微软提供的 ...

  3. AnjularJS系列2 —— 表单控件功能相关指令

    第二篇,表单控件功能相关指令. ng-checked控制radio和checkbox的选中状态 ng-selected控制下拉框的选中状态 ng-disabled控制失效状态 ng-multiple控 ...

  4. 基于CkEditor实现.net在线开发之路（3）常用From表单控件介绍与说明

    上一章已经简单介绍了CKEditor控件可以编写C#代码,然后可以通过ajax去调用,但是要在网页上面编写所有C#后台逻辑,肯定痛苦死了,不说实现复杂的逻辑,就算实现一个简单增删改查,都会让人头痛欲裂 ...

  5. Vue#表单控件绑定

    使用v-model 在表单控件上实现数据双向绑定. 单选:https://jsfiddle.net/miloer/bs49p0fx/ <input type="checkbox&quo ...

  6. 了解HTML表单之13个表单控件

    目录 传统控件 button select option optgroup textarea fieldset legend label 新增控件 datalist keygen output pro ...

  7. HTML5(常用的表单控件)

    常用的HTML5的表单控件: Input 类型: color color 类型用在input字段主要用于选取颜色,如下所示: 从拾色器中选择一个颜色: 选择你喜欢的颜色: <input type ...

  8. wicket基础应用(2)--wicket表单控件的使用

    该文可以转载,但转载必须注明作者,出处: 作者:lhx1026 出处:http://lhx1026.iteye.com/ 这一章介绍wicket表单控件的简单应用 1.Label控件 这个应该说是最常 ...

  9. Bootstrap系列 -- 18. 表单控件大小

    前面看到的表单控件都正常的大小.可以通过设置控件的height,line-height,padding和font-size等属性来实现控件的高度设置.不过Bootstrap框架还提供了两个不同的类名, ...

  10. Bootstrap系列 -- 14. 表单控件输入框input

    每一个表单都是由表单控件组成.离开了控件,表单就失去了意义.接下来的我们简单的来了解Bootstrap框架中表单控件的相关知识. 单行输入框,常见的文本输入框,也就是input的type属性值为tex ...

随机推荐

  1. RxJava如何结合观察者与链式处理

    RxJava如何结合观察者与链式处理 Author: Dorae Date: 2018年12月3日17:10:31 转载请注明出处 一.概述 首先问自己几个问题,如果非常清楚这几个问题的目的与答案,那 ...

  2. 【CV论文阅读】YOLO：Unified, Real-Time Object Detection

    YOLO的一大特点就是快,在处理上可以达到完全的实时.原因在于它整个检测方法非常的简洁,使用回归的方法,直接在原图上进行目标检测与定位. 多任务检测: 网络把目标检测与定位统一到一个深度网络中,而且可 ...

  3. javascript中数组的定义及使用

    js <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o ...

  4. 从打击App刷榜看苹果的底线

    这两天苹果打击App刷榜者的消息刷屏了,从腾讯科技.appying多个媒体渠道看到,<安居客>.<友秘>.<微在>.<秦时明月2>.<悟空与貂蝉& ...

  5. Java异常&&RuntimeException异常

    Java异常可分为3种: (1)编译时异常:Java.lang.Exception (2)运行期异常:Java.lang.RuntimeException (3)错误:Java.lang.Error ...

  6. [python基础] celery beat/task/flower解析

    一.Celery 介绍 Celery 是一个强大的分布式任务队列,它可以让任务的执行完全脱离主程序,甚至可以被分配到其他主机上运行.我们通常使用它来实现异步任务( async task )和定时任务( ...

  7. JZOJ 1667 ( bzoj 1801 ) [ AHOI 2009 ] 中国象棋 —— DP

    题目:https://jzoj.net/senior/#main/show/1667 首先,一行.一列最多只有 2 个炮: 所以记录一下之前有多少行有 0/1/2 个炮,转移即可: 注意取模!小心在某 ...

  8. 50.Ext_数字输入框_Ext.form.NumberField

    转自:https://blog.csdn.net/inflaRunAs/article/details/84033618 <mce:script type="text/javascri ...

  9. [Swift通天遁地]三、手势与图表-(10)创建包含圆点、方形、三角形图标的散点图表

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  10. 牛客小白月赛15 C 表单 ( map 使用）

    链接:https://ac.nowcoder.com/acm/contest/917/C来源:牛客网 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 262144K,其他语言52428 ...