form：表单
form定义了一个表单，表示一起提交的数据。
属性：
action：定义数据提交的位置(书提交到哪里)
method：提交的方式，分为get/post。两者的不同将在后台处理中进行解释。
id：给form定义一个唯一的ID值。
name：给form定义一个名称。
label标签：用来辅助文本输入框，在点击label时可以直接进入文本框。
属性：for-->填写具体的文本框的id值，点击此label时会鼠标会跳到对应ID的文本框中。
input；文本输入框，属于内联块(inline-block)标签。
默认情况下输入框在点击时会有蓝色边框效果显示。
属性：
type：定义文档框的类别。
text(默认值)：普通文本框。
password：密码框，输入的内容均以点显示。
radio：单选框。只有name相同的radio才能只选择一个。
checkbox：复选框。只有name相同的checkbox才算是一组信息。
file：上传文件。样式无法修改。
submit：提交按钮。通过value来修改按钮的显示文字。
reset：重置按钮。通过value来修改按钮的显示文字。
button：普通按钮。通过value来修改按钮的显示文字。
width：定义文本框的宽度。
value：填写文本框的默认值。
placeholder：文本框的占位提示信息，是html5的新属性。
在radio和checkbox中checked="checked"表示默认已经被选中。
修改placeholder样式：当修改文本框的字体颜色和大小等样式时无法修改placeholder的样式，
只能针对不同的浏览器来修改placeholder的样式。
谷歌浏览器：
::-webkit-input-placeholder{
color:red;
}
火狐浏览器：
::-moz-placeholder{
color:green;
}
IE浏览器(仅在IE10及以上版本可用)：
:-ms-input-placeholder{
color: #9A32CD;
}
下拉框：select-->样式不好修改，以后通过js来实现。
多行文本输入框：textarea
属性：
cols-->定义文本框的宽度,也可以通过样式的width来调整。
rows-->定义文本框的高度,也可以通过样式的height来调整。
样式：
outline:none--->点击时不出现蓝色边框效果。
resize:none--->不可以随意调整大小。
示例代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表单</title>
<style>
/*设置谷歌浏览器文本输入框的占位提示信息的样式*/
::-webkit-input-placeholder{
color:red;
}
/*设置火狐浏览器placeholder样式*/
::-moz-placeholder{
color:green;
}
/*设置IE浏览器placeholder样式，只在IE10及以上版本可用*/
:-ms-input-placeholder{
color: #9A32CD;
}
input{
/*去除文本框点击时蓝色边框效果*/
outline: none;
width: 200px;
/*设置文本框文字的颜色*/
color:blue;
}
.sex,.ho{
width: 20px;
}
textarea{
outline: none;
/*设置为不可调整多行文本框大小*/
resize: none;
}
</style>
</head>
<body>
<form action="" method="post" id="form1" name="myform">
<input type="text" placeholder="请输入用户名" /><br>
<input type="password" /> <br>
<input type="radio" id="man" class="sex" checked="checked" name="gender" />
<label for="man">男</label>
<input type="radio" id="nv" class="sex" name="gender" />
<label for="nv">女</label><br>
<input type="checkbox" name="hobby" class="ho" />唱歌
<input type="checkbox" name="hobby" class="ho" />跳舞
<input type="checkbox" checked="checked" name="hobby" class="ho" />朗诵
<input type="checkbox" name="hobby" class="ho" />表演 <br>
<input type="file" /> <br>
<input type="submit" value="提交吧" />
<input type="reset" value="重新填写" />
<input type="button" value="普通按钮" /><br>
<select>
<option>北京</option>
<option>上海</option>
<option>广州</option>
<option>深圳</option>
</select> <br>
<textarea cols="50" rows="10"></textarea>
</form>
</body>
</html>
效果如下所示：
相关推荐
员工信息录入表单介绍.zip" 的压缩包中，我们聚焦于一个关键的Web开发主题：如何使用SSH（Struts2、Spring、Hibernate）框架，Maven构建工具以及Bootstrap前端框架来创建员工信息录入的表单。这个视频教程可能包含...
本文将详细介绍ExtJS中常用表单组件的创建、应用以及验证和数据绑定等方面的知识，旨在帮助读者深入理解和掌握ExtJS表单的使用方法。 ### 表单面板（FormPanel）的创建 在ExtJS中，表单面板（FormPanel）是创建...
总之，"登录注册表单介绍响应式网页模板"是一个涵盖了前端开发多个方面的话题，包括HTML5表单元素、响应式CSS设计、JavaScript交互以及可能的视觉增强效果。理解和应用这些知识点，能够帮助开发者创建出适应各种设备...
【Java实战开发企业级员工信息管理系统视频教程】 此项目所采用的技术架构：spring + spring mvc + hibernate + jQuery + Bootstrap
本章主要涵盖了三个关键知识点：表单介绍、文本框脚本和选择框脚本。 一、表单介绍 HTML中的表单是通过`<form>`元素创建的，而在JavaScript中，表单与HTMLFormElement类关联。HTMLFormElement类继承自HTMLElement，...
1. 表单介绍： 表单是Visual Foxpro提供的主要交互界面，它涵盖了多种类型的对话框和窗口。例如，简单的应用程序如记事本和计算器的界面就是表单的不同形式。表单自身作为一个容器，可以包含各种不同类型的控件。 ...
表单介绍 表单是HTML页面中负责数据采集功能的部件。由表单标签，表单域和表单按钮组成。通过表单，将用户输入的数据提交给服务器，并交给服务端进行处理。 表单标签 用于声明表单的范围，位于表单标签的元素将被...
本文将详细介绍如何使用Vue和Iview实现动态表单。 首先，动态表单的核心在于数据驱动。Vue.js的响应式系统使得数据和视图之间的绑定变得简单。在创建动态表单时，我们通常会有一个JSON对象，其中包含了表单的布局、...
下面将详细介绍关于form表单的相关知识点。 1. **HTML表单基础** HTML中的`<form>`标签用于定义表单，可以包含各种输入控件，如文本框、密码框、复选框、单选按钮、下拉菜单等。例如： ```html 用户名: ...
`说明.htm`文件很可能是该软件或库的用户指南或文档，详细介绍了如何创建和配置包含计时器的自定义表单。 使用自定义表单设计工具，开发者或业务人员可以： - **灵活布局**：自由排列表单元素，使其适应不同屏幕...
表单应用简介、表单管理员角色设置、枚举、流水号制作、表单操作
下面将详细介绍表单测试用例的设计和测试过程。 一、表单测试用例设计 在设计表单测试用例时，需要考虑到表单的功能和外观。开发者可以使用“预览表单”功能来测试表单的功能和外观。预览表单功能可以让开发者从...
本文将从以下几个方面对“梦行表单”的功能和应用场景进行详细介绍： ### 一、梦行表单简介 “梦行表单”作为一款开源/共享/互联网快速开发平台的服务之一，它主要面向企业用户和个人用户提供便捷的表单设计与数据...
本文主要针对“jquery表单验证插件”进行详细介绍，并通过示例代码展示其使用方法。 #### 二、jQuery Form插件介绍 jQuery Form插件由Malsup开发，是一款非常实用的jQuery扩展，能够极大地简化表单的Ajax提交过程。...
基础资料介绍 报表介绍 动态表单介绍 参数介绍 卡片介绍 轻量卡片介绍 布局介绍 页面属性说明 动态表单页面属性 单据页面属性 列表属性 弹性域属性 报表属性 移动页面开发 控件使用指南 单据转换 反写规则 应用开发 ...
接下来，我将分别介绍微信小程序、表单设计、动画实现以及数据处理这几个方面的知识点。 首先，微信小程序是一个不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。...
本文将详细介绍这些表单类型的特点以及如何使用它们。 #### 二、内置表单（动态表单） 内置表单是Activiti中最常用且易于使用的表单类型之一。它允许用户在设计流程模型时直接定义表单字段，简化了表单开发过程。...
Jquery提交表单 Form