HTML表单元素

表单元素同意的形式向用户(例:文本字段,下拉列表,单箱,检查盒等)输入元素信息

表单标签

文本域(Text Fields)

当用户要在表单中键入字母,数字等内容时,就会用到文本域

单选button(Radio Buttons)

当用户从若干给定的的选择中选取其一时,就会用到单选框

复选框(Checkboxes)

当用户须要从若干给定的选择中选取一个或若干选项时,就会用到复选框

表单的动作属性(Action)和确认button

当用户单击确认button时,表单的内容会被传送到还有一个文件,表单的动作属性定义了目的文件的文件名称,由动作属性定义的这个文件一般会对接收到的输入数据进行相关的处理

以下举几个样例

<html>

<head>

<title>Welcome</title>

</head>

<h1>登录</h1>

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

用户名:<input type="text" name="username"/><br/>

密  码:<input type="password" name="pwd"/></br>

<input type="submit" value="登录"/>  <input type="reset" value="又一次填写"/></br>

<input type="checkbox" name="v1">西瓜</br>

<input type="checkbox" name="v1">苹果</br>

<input type="radio" name="sex"/>男</br>

<input type="radio" name="sex"/>女</br>

<!--隐藏的用处是课提交数据,同一时候不影响界面-->

<input type="hidden" value="123" name="sal"/>

选择你的出生地:

<select name="bir">

<option value="">--请选择--</option>

<option value="bj">北京</option>

<option value="bj">上海</option>

<option value="cq">重庆</option>

</select>

</br>

请留言</br>

<textarea cols="30" rows="10"></textarea></br>

选择要上传的文件</br>

请选择文件:<input type="file" name="myfile"/></br>

</select>

</form>

</body>

</html>

打开如图所示的网页






HTML表单元素的更多相关文章

  1. HTML5 学习总结（二）——HTML5新增属性与表单元素

    一.HTML5新增属性 1.1.contextmenu contextmenu的作用是指定右键菜单. <!DOCTYPE html> <html> <head> & ...

  2. CSS之表单元素

    表单就是收集用户信息的,就是让用户填写的.选择的. 1                <div> 2                         <h3>欢迎注册本网站&l ...

  3. 表单元素的submit()方法和onsubmit事件

    1.表单元素中出现了name="submit"的元素 2.elemForm.submit();不会触发表单的onsubmit事件 3.动态创建表单时遇到的问题 表单元素拥有subm ...

  4. HTML5 学习笔记（二）——HTML5新增属性与表单元素

    目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placehold ...

  5. 【原】如何改变表单元素的外观(for Webkit and IE10)

    表单元素在网页设计中使用的非常频繁,如文本输入框.单选框.复选框.选择列表.上传文件,它们在浏览器中的展现有自带的外观,为了在视觉上取得更好的产品体验,保持客户端的统一,通常产品经理会提出需要改变它的 ...

  6. MVC中使用内建的HTML辅助方法产生表单元素提交表单与button按钮事件的陷阱

    网站模板页有个登陆的退出按钮,当点击时跳转到登陆页面. <button onclick="logout()" >退出</button> $("#l ...

  7. [转]CSS 表单元素对齐详解

    来源:http://blog.sina.com.cn/s/blog_655388ed0100lzyk.html 简单的设置input{vertical-align:middle}即可,完美的: lab ...

  8. VUE 表单元素双向绑定总结

    checkbox最基本用法: <input type="checkbox" v-model="inputdata" checked/> <in ...

  9. iScroll4下表单元素聚焦及键盘的异常问题

    本文是zawa同事写的一篇博文,相信很多在webapp开发中的同学使用iscroll4会遇到的该问题,问过zawa兄的建议,在这里分享给大家,希望能帮助到各位~ 原文地址:http://www.zaw ...

  10. 9月8日HTML表单元素（form、文本、按钮、选择）

    表单元素 一.form form代表表单,功能:用于申明表单,定义采集数据的范围,也就是<form>和</form>里面包含的数据将被提交到服务器或者电子邮件里.<for ...

随机推荐

  1. POJ 3979 分数减法【数学问题的探讨】

    将a/b和c/d简化一下就可以了 分数加减法 Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 12588   Accepted ...

  2. centos安装wget 及配置（转）

    yum -y install wget #yum install perl Searching for GCC... The path "" is not valid path t ...

  3. paip.将数据导入到在英语语音数据库mysql道路解决空原则问题

    paip.将数据导入到在英语语音数据库mysql道路解决空原则问题 #---原因:mysql 导入工具bug #---解决:不要使用双引号括注音. 笔者 老哇爪 Attilax 艾龙.  EMAIL: ...

  4. Sql Server存储过程和函数浅谈

    今天给大家总结一下sql server中的存储过程和函数.本人是小白,里面内容比较初级,大神不喜勿喷 自行飘过就是.. 首先给大家简单列出sql server中的流控制语句,后面会用到的^_^ sql ...

  5. Object-c中间initialize 与 辛格尔顿

    简单说下initialize任务.在初始化过程中同样的类将被调用一次. 直接在代码解释initialize任务. 创建一个InitTest类 InitTest.m #import "Init ...

  6. Java加深理解有关注释

    一.获取应用笔记 常常会遇到这种情况 package Tokyo.Hot; public class Demo { public static void main(String[] args) { n ...

  7. Ubuntu 14.04 grub2 温馨提示

    昨天win7在...的基础上,刚装几天发布Ubuntu14.04.Ubuntu14.04还是很不错的.但是,今天想去下一个Win7,但没有发现平时的开机显示grub2选项,直接进了Ubuntu! 我感 ...

  8. 如何解决FormView中实现DropDownList连动选择时出现 "Eval()、XPath() 和 Bind() 这类数据绑定方法只能在数据绑定控件的上下文中使用" 的错误

    原文:如何解决FormView中实现DropDownList连动选择时出现 "Eval().XPath() 和 Bind() 这类数据绑定方法只能在数据绑定控件的上下文中使用" 的 ...

  9. hdu Word Amalgamation（map）

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1113 找单词 #include <iostream> #include <strin ...

  10. validateRequest="false"属性及xss攻击

    validateRequest="false"   指是否要IIS验证页面提交的非法字符,比如:>,<号等,当我们需要将一定格式得html代码获得,插入数据库时候,就要 ...