html—表单控件
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表单元素</title>
</head>
<body>
<!--
表单就是从浏览器向服务器传输数据的手段
表单具备两个要素:
-Form 表单元素
-表单控件
表单主要用于显示、收集和提交信息到服务器
-->
<form action="" method="post">
<!--
-action :表单提交的URL
-method :表单数据的提交方式
-entype : 表单数据进行编码的方式
-->
<!--
表单控件:
文本框、密码框
单选框、复选框
按钮
隐藏域、文件选择框
--其他:
标签、文本域、下拉选框等等
-->
<h1>表单</h1>
<!-- input 元素作 文本框和密码框 -->
<!-- 常用属性:
value 属性:对应输入框或者密码框的文本内容
maxlength: 限制输入的字符数
readonly:设置文本只读
-->
<p>
<label for="name"> 用户名:</label>
<input type="text" id="name" name="user" value="<请输入你的用户名>"/>
</p>
<!-- label 标签元素,用于给控件设置名称
for :设置该文本所关联的控件ID,关联后点击标签等于点击控件
-->
<p>
<label for ="pass">密码:</label>
<input type="password" id="pass"name="pass" maxlength="8">
</p>
<!-- input 元素作 单选框和复选框 -->
<p>
性别:
<label for="m">男:</label>
<input type="radio" name="sex" id="m" value="m">
<label for="f">女:</label>
<input type="radio" name="sex" id="f" checked="checked" value="f">
<!-- 常用属性:
name 属性:用于实现分组,一组单选框或者复选框的名称必须相同。
cheched 属性:设置选中的
value 属性:文本,当页面提交表单时,会把对应的value值发送到服务器
-->
</p>
<p>
爱好:<br>
<input type="checkbox" name="hobby" value="1">打篮球
<input type="checkbox" name="hobby"value="2">踢足球<br>
<input type="checkbox"name="hobby"value="3">打乒乓球
<input type="checkbox"name="hobby"value="4">滑雪<br>
<input type="checkbox"name="hobby"value="5">爬山
<input type="checkbox"name="hobby"value="6">拳击<br>
</p>
<!--input 元素作 按钮
提交按钮: submit
--传送表单数据给服务端或者其他程序处理
重置按钮 : reset
--清空表单的内容并把所有表单控件还原成默认状态和默认值
普通安丘 : button
--用于执行客户端脚本
属性 : value:按钮的名字
-->
<p>
<input type="submit" value="保存">
<input type="reset" value="重置">
<input type="button" value="取消">
</p>
<!-- 隐藏域 和文件选框
隐藏域 hidden --在表单中包含不希望用户看见的信息
文件选框 file --上传文件到服务器
-->
<input type="hidden" name="用户性格" value ="sb">
<input type="file"><br>
<!--
文本域
相当于多行文本框
<textarea>元素
主要属性:
cols :指定文区域的列数
rows: 指定文本区域的行数.
readonly: 只读
-->
<p>
文本区域:<br>
<textarea rows="10" cols="10">
广州市天河区天河路大厦西厅2407号
</textarea>
</p>
<!-- 下拉选单 -->
<p>课程:<br>
<select name="course">
<option value="1">java</option>
<option value="2">PHP</option>
<option value="3">.NET</option>
</select>
</p>
</form>
</body>
</html>
html—表单控件的更多相关文章
- “此网页上的某个 Web 部件或 Web 表单控件无法显示或导入。找不到该类型,或该类型未注册为安全类型。”
自从vs装了Resharper,看见提示总是手贱的想去改掉它.于是乎手一抖,把一个 可视web部件的命名空间给改了. 喏,从LibrarySharePoint.WebPart.LibraryAddEd ...
- MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件
类似于多层级的角色与权限控制功能,用MVC实现MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件.最近我们的项目中需要用到树型菜单,以前使用WebForm时,树型菜单有微软提供的 ...
- AnjularJS系列2 —— 表单控件功能相关指令
第二篇,表单控件功能相关指令. ng-checked控制radio和checkbox的选中状态 ng-selected控制下拉框的选中状态 ng-disabled控制失效状态 ng-multiple控 ...
- 基于CkEditor实现.net在线开发之路(3)常用From表单控件介绍与说明
上一章已经简单介绍了CKEditor控件可以编写C#代码,然后可以通过ajax去调用,但是要在网页上面编写所有C#后台逻辑,肯定痛苦死了,不说实现复杂的逻辑,就算实现一个简单增删改查,都会让人头痛欲裂 ...
- Vue#表单控件绑定
使用v-model 在表单控件上实现数据双向绑定. 单选:https://jsfiddle.net/miloer/bs49p0fx/ <input type="checkbox&quo ...
- 了解HTML表单之13个表单控件
目录 传统控件 button select option optgroup textarea fieldset legend label 新增控件 datalist keygen output pro ...
- HTML5(常用的表单控件)
常用的HTML5的表单控件: Input 类型: color color 类型用在input字段主要用于选取颜色,如下所示: 从拾色器中选择一个颜色: 选择你喜欢的颜色: <input type ...
- wicket基础应用(2)--wicket表单控件的使用
该文可以转载,但转载必须注明作者,出处: 作者:lhx1026 出处:http://lhx1026.iteye.com/ 这一章介绍wicket表单控件的简单应用 1.Label控件 这个应该说是最常 ...
- Bootstrap系列 -- 18. 表单控件大小
前面看到的表单控件都正常的大小.可以通过设置控件的height,line-height,padding和font-size等属性来实现控件的高度设置.不过Bootstrap框架还提供了两个不同的类名, ...
- Bootstrap系列 -- 14. 表单控件输入框input
每一个表单都是由表单控件组成.离开了控件,表单就失去了意义.接下来的我们简单的来了解Bootstrap框架中表单控件的相关知识. 单行输入框,常见的文本输入框,也就是input的type属性值为tex ...
随机推荐
- shiro#springboot
1. shiro的使用围绕着securityManager,权限需要从realm中来. securityManager可以设置realm或者realms,或者通过设置authenticator来设置r ...
- Verilog 2001 `default_nettype none
在Verilog 1995規定,對於沒宣告的信號會自動視為wire,這樣常常造成debug的困難,Verilog 2001另外定義了`default_nettype none,將不再自動產生wire. ...
- 嵊州普及Day1T2
题意:走迷宫.求走到a[n][n]需要多久. 考场上想的dfs,听老师说最多50分.代码懒得码了,知道是走迷宫就好. 正解:bfs,时间复杂度O(n). 见代码: #include<iostre ...
- System.Data.SqlClient.SqlException: 'Incorrect syntax near 'OFFSET'.
https://www.nopcommerce.com/boards/t/54586/410-not-running-on-local-system.aspx#209684 Hello, I was ...
- 数据库连接需要dll
连接oracle引用: Oracle.ManagedDataAccess.dll和Oracle.ManagedDataAccess.EntityFramework.dll, 连接sqlserver 连 ...
- Golang的类型转换实战案例
Golang的类型转换实战案例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.数据类型概述 基础数据类型概述,博主推荐阅读: 布尔型: https://www.cnblogs. ...
- NRF51822和NRF52832的主要区别
对于NRF51822和NRF52832的选择性相信大家也是非常困惑的,哪个性价比高?下面为大家讲下NRF51822和NRF52832的一个区别,让大家能够更好的快速选型加快研发产品进度! 主要分为 ...
- 3.python进制及其之间的转换
- 留学英文论文写作Abstract三种类型
所谓Abstract,就是对所写论文主要内容的精炼概括.Abstract是美国人的说法,英国的科技期刊喜欢称之为Summary.在英文中,有资料是这么对其定义的:Abstract is a sketc ...
- 干货分享|Critique Essay写作解析
Critique essay要求学生对另一篇文章进行批判性分析,通常是一本书.期刊文章或论文.不管你的专业是什么,你可能会被要求在某个时候写一篇Critique essay.拿心理学专业举例,评论一篇 ...