html表单 2017-03-10PM
在写表单之前补充一点:网页名以及属性的值命名都不能用中文,尽量用英文或拼音。
html表单特写
1、表单格式
<form method="get/post" action="data.html" target="_blank/_self">
<input/>
</form>
注:表单属性:
Method是指网页传输方式,get是直接传递,提交有长度限制,并且编码后的内容在地址栏可见;post是从后台传递,提交无长度限制,且编码后内容不可见。
Action是负责接受的文件。
Target 是指打开方式
2、文本输入
(1)文本框
<input type="text" name="user name" value/placehoder="提示文字"/>
注:
value 与placeholder都是将信息显示在文本框中,在输入文本框时,value(显示为黑色)需要重新删除;placeholder会显示(为灰色)但不占位,输上信息后消失。
(2)密码
<input type="password" name="psd" readonly="readonly" value="1234"/>
注:readonly表示只读,不希望别人修改value的值。效果等同于disabled.
(3) 文本域
<textarea rows="行数" maxlength="字的长度"></textarea>
(4)隐藏域
<input type="hidden" name=" " value=" "/>
注:虽不显示,可用于后台统计数据;也可用于编写不想让用户看到的信息。
3、按钮
(1)提交按钮
<input type="submit" name=" " value="按钮名称" disabled="disabled" />
(2)重置按钮
<input type="reset" value="重置" disabled="disabled" />
(3) 图片按钮 = 作用等同于提交按钮
<input type="image" src="./1.jpg" width="100" height="100" disabled="disabled"/>
(4)普通按钮
<input type="button" name=" " value="注册" />
4、选择输入
(1)单选按钮
格式:
<input type="radio" name="sex" value="1" id="s1" checked="checked"/>
<label for="s1">男</label>
<input type="radio" name="sex" value="0" id="s2" />
<label for="s2">女</label>
注:
a.同一个name的分为一组(即当选中一个时,其他的不能再选)
b、value值时看不见的,直接提交给程序;
c、cheked是默认选项,不会影响你的选择。
d、lable标签作用:当你鼠标点击汉字“男”“女”时,你也会选中。注意for的值要等于id的值。
(2)复选框
<input type="checkbox" name="c1" value="v1" id="s2" />
<label for="s2" >足球</label>
<input type="checkbox" name="c2" value="v2" id="s3" />
<label for="s3" checked="checked">篮球</label>
<input type="checkbox" name="c3" value="v3" id="s4" />
<label for="s4">乒乓球</label>
注:checked设为默认。
(3)下拉列表
<select name="set" size=" " multiple="multiple">
<option value="1112">张店</option>
<option selected="selected">沂源</option>
<option>桓台</option>
<option>石桥</option>
</select>
注:selected设为默认。
上传的值有优先顺序,有value值的先传value值(选择提交后在地址栏优先显示)。
问题:name,value, id有什么区别?
name:设定的值提交给后台,不会显示在网页中,用于提交数据。
value:设定的值在按钮标签中显示的是按钮名称;在文本框中显示的是值的内容;
Reflections:
Remember accurately and practice agian and again.
Thanks for the day is a sunny day; thanks for the people I met; and thanks for everything.
Hope everything goes ok.
html表单 2017-03-10PM的更多相关文章
- Element Form表单实践(上)
作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...
- html笔记03:表单
1.表单是用来收集用户填写的信息,可以说表单就是一个容器,里面的元素的类型可以不一样,所表示的功能也不同. 表单基本语法: <html> <head> <title> ...
- html表单---学习笔记03
第8章 表单 8.1 表单标记<form> <form name="表单名称" method="提交方法" action="处理程序 ...
- 2017年12月17日 ASP.NET 12个表单元素&&简单控件/复合控件
12个表单元素可以分为三大类 第一类:文本类 <input type = "text" /> //普通文本框 <input type = "passwo ...
- 2017.2.28 activiti实战--第七章--Spring容器集成应用实例(五)普通表单
学习资料:<Activiti实战> 第七章 Spring容器集成应用实例(五)普通表单 第六章中介绍了动态表单.外置表单.这里讲解第三种表单:普通表单. 普通表单的特点: 把表单内容写在 ...
- 2017.2.28 activiti实战--第六章--任务表单(二)外置表单
学习资料:<Activiti实战> 第六章 任务表单(二)外置表单 6.3 外置表单 考虑到动态表单的缺点(见上节),外置表单使用的更多. 外置表单的特点: 页面的原样显示 字段值的自动填 ...
- 2017.2.28 activiti实战--第六章--任务表单(一)动态表单
学习资料:<Activiti实战> 第六章 任务表单(一)动态表单 内容概览:本章要完成一个OA(协同办公系统)的请假流程的设计,从实用的角度,讲解如何将activiti与业务紧密相连. ...
- 2017.2.22 activiti实战--第六章--任务表单
学习资料:<Activiti实战> 第六章 任务表单 本章将一步步完成一个协同办公系统(OA)的请假流程的设计,讲解如何将Activiti和实际业务联系起来. 首先讲解动态表单与外置表单的 ...
- 分页功能实现之通过ajax实现表单内容刷新
拿代码来说话 我们的需求就是点击翻页功能,实现表格内容局部刷新且能够翻到对应的页面上,不明白? 那么就看看下面的图,需要达到的效果如下所示: 现在要实现的功能就是把红线框起来的表单内容 在点击翻页的时 ...
- input表单(02)
01.表单的代码实现 <!DOCTYPE html> <html> <head> <title>世纪佳缘,你在我也在</title> < ...
随机推荐
- 【angularjs】【学习心得】路由实战篇
今天还是来说一下angular中的路由模块.我们实际项目中,各个页面的切换是经常会与Auth相关的.比如我网站的后台,是需要登录过的用户才能进去,那么我们用angularJS做前端路由的时候应该怎么完 ...
- php生成PDF文件(FPDF)
首先要下载FPDF http://www.fpdf.org/ 附件可以在我的资源里下载http://yunpan.cn/c3RJ5BpPfX6dL 访问密码 f1f2 FPDF文档:http:// ...
- Eclipse中javascript文件 clg 变为console.log();
Eclipse中javascript文件 clg 变为console.log(); window>preferance>JavaScript>Editor>Templates ...
- 按钮(Buton)组价的功能和用法
Button继承了TextView,它主要是在UI界面上生成一个按钮,该按钮可以供用户单机,当用户单击按钮时,按钮会触发一个onClick事件. 按钮使用起来比较容易,可以通过为按钮指定android ...
- 安装使用GYP,并编译libpomelo2
1.然后是下载GYP,它是由 Chromium 团队开发的跨平台自动化项目构建工具,安装后可以使用其构建出libpomelo的vs工程项目,再而进行编译,这步先下载,地址: http://code.g ...
- 各个浏览器开启CSS Grid Layout的方式
2017年3月,Chrome.Firefox将开启默认支持. 当然对于很多人等不及浏览器默认支持,想提前体验一把,这里提供一些打开方式: 1.Chrome 在浏览器中输入:chrome://flags ...
- Linux笔记(十三) - 系统管理
(1)进程管理1.判断服务器健康状态2.查看进程a.查看系统中所有进程:ps 例:ps aux(使用BSD操作系统命令格式) a 显示所有前台进程 x 显示所有后台进程 u 显 ...
- 简单的java Hadoop MapReduce程序(计算平均成绩)从打包到提交及运行
[TOC] 简单的java Hadoop MapReduce程序(计算平均成绩)从打包到提交及运行 程序源码 import java.io.IOException; import java.util. ...
- [TPYBoard-Micropython之会python就能做硬件 4] 学习使用电位器和1602显示屏
一.实验器材 1.TPYboard V102板 一块 2.电位器 一个 3.1602 屏 一块 4.杜邦线:若干 二.电位器的使用 电位器 (英文:Potentiometer)是可变电阻器的一种 ...
- Linux驱动技术(七) _内核定时器与延迟工作
内核定时器 软件上的定时器最终要依靠硬件时钟来实现,简单的说,内核会在时钟中断发生后检测各个注册到内核的定时器是否到期,如果到期,就回调相应的注册函数,将其作为中断底半部来执行.实际上,时钟中断处理程 ...