在写表单之前补充一点:网页名以及属性的值命名都不能用中文,尽量用英文或拼音。

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的更多相关文章

  1. Element Form表单实践(上)

    作者:小土豆biubiubiu 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/58c61b4361ff4b005d9e8 ...

  2. html笔记03:表单

    1.表单是用来收集用户填写的信息,可以说表单就是一个容器,里面的元素的类型可以不一样,所表示的功能也不同. 表单基本语法: <html> <head> <title> ...

  3. html表单---学习笔记03

    第8章 表单 8.1 表单标记<form> <form name="表单名称" method="提交方法" action="处理程序 ...

  4. 2017年12月17日 ASP.NET 12个表单元素&&简单控件/复合控件

    12个表单元素可以分为三大类 第一类:文本类 <input type = "text" /> //普通文本框 <input type = "passwo ...

  5. 2017.2.28 activiti实战--第七章--Spring容器集成应用实例(五)普通表单

    学习资料:<Activiti实战> 第七章  Spring容器集成应用实例(五)普通表单 第六章中介绍了动态表单.外置表单.这里讲解第三种表单:普通表单. 普通表单的特点: 把表单内容写在 ...

  6. 2017.2.28 activiti实战--第六章--任务表单(二)外置表单

    学习资料:<Activiti实战> 第六章 任务表单(二)外置表单 6.3 外置表单 考虑到动态表单的缺点(见上节),外置表单使用的更多. 外置表单的特点: 页面的原样显示 字段值的自动填 ...

  7. 2017.2.28 activiti实战--第六章--任务表单(一)动态表单

    学习资料:<Activiti实战> 第六章 任务表单(一)动态表单 内容概览:本章要完成一个OA(协同办公系统)的请假流程的设计,从实用的角度,讲解如何将activiti与业务紧密相连. ...

  8. 2017.2.22 activiti实战--第六章--任务表单

    学习资料:<Activiti实战> 第六章 任务表单 本章将一步步完成一个协同办公系统(OA)的请假流程的设计,讲解如何将Activiti和实际业务联系起来. 首先讲解动态表单与外置表单的 ...

  9. 分页功能实现之通过ajax实现表单内容刷新

    拿代码来说话 我们的需求就是点击翻页功能,实现表格内容局部刷新且能够翻到对应的页面上,不明白? 那么就看看下面的图,需要达到的效果如下所示: 现在要实现的功能就是把红线框起来的表单内容 在点击翻页的时 ...

  10. input表单(02)

    01.表单的代码实现 <!DOCTYPE html> <html> <head> <title>世纪佳缘,你在我也在</title> < ...

随机推荐

  1. animate的{queue:false,duration:400}意思

    示例:$(document).ready(function(){ $('.tmplS').hover(function(){ $(".cover", this).stop().an ...

  2. Java 伪静态 Mapping

    1. 概念 伪静态,简单来说是指转换url地址,在这里用来替换掉urlMapping.因为urlMapping需要为每一个页面都进行配置,非常麻烦. 2. RequestMapping 3. Spri ...

  3. git 终端克隆

    mac版 用终端克隆码云中的文档到PC端   第一步:cd desktop //打开桌面 第二步:ls //打印桌面 第三步:(cd +建好的文件夹拖进去) //自己建好的文件夹 或者cd + 文件名 ...

  4. Microsoft Office 2016 简体中文 Vol 版镜像下载(Pro Plus、Visio、Project 下载)

    在使用上,零售版和批量授权版并没有区别,只是授权方式方面的区别,相对而言,VOL 版的更容易激活一些,其他并没有什么区别了. 有需要的可以在下面下载:(以下均是 VL 版) 版本:Office 201 ...

  5. SQL SERVER分区具体例子详解

    在日常工作中,我们会遇到以下的情况,一个表每日数万级的增长,而查询的数据通常是在本月或今年,以前的数据偶尔会用到,但查询和插入的效率越来越慢,用数据库分区会有助于解决这个问题.关于分区的理论知识网上很 ...

  6. POJ2187(旋转卡壳)

    Beauty Contest Time Limit: 3000MS   Memory Limit: 65536K Total Submissions: 35459   Accepted: 10978 ...

  7. Hadoop权威指南:压缩

    Hadoop权威指南:压缩 [TOC] 文件压缩的两个好处: 减少储存文件所需要的磁盘空间 加速数据在网络和磁盘上的传输 压缩格式总结: 压缩格式 工具 算法 文件扩展名 是否可切分 DEFLATE ...

  8. 第七届蓝桥杯javaB组真题解析-分小组(第四题)

    题目 /* 分小组 9名运动员参加比赛,需要分3组进行预赛. 有哪些分组的方案呢? 我们标记运动员为 A,B,C,... I 下面的程序列出了所有的分组方法. 该程序的正常输出为: ABC DEF G ...

  9. quartz配置时间

    我们需要把log4j的配置文件放入src目录下,启动main类就可以了. Cron Expressions cron的表达式被用来配置CronTrigger实例. cron的表达式是字符串,实际上是由 ...

  10. ASP.NET MVC用存储过程批量添加修改数据

    用Entity Framework 进行数据库交互,在代码里直接用lamda表达式和linq对数据库操作,中间为程序员省去了数据库访问的代码时间,程序员直接可以专注业务逻辑层的编写.但是对于比较复杂的 ...