表单

<form id="" name="" method="post/get" action="负责处理的服务端"> </form>

在表单中能放置什么内容？

1、文字输入

<form>

账号：<input type="text"  /><br />

密码：<input type="password" /><br />

<br />

账号：<input type="text" value="wow-wolcome" /><br />

密码：<input type="password" /><br />

<br />

账号：<input type="text" placeholder="请输入账号" /><br />

密码：<input type="password" /><br />

<br />

说说<textarea cols="" rows=""></textarea>

</form>

文字输入

文本框：<input type="text" />  可以不设置其他    设置value值——设置默认值    设置placeholder值——设置提示信息，灰色显示，输入时消失

内容可以是数字、英文、汉字、符号

密码框：<input type="password"/> 不管输入什么 显示的都是黑点

文字域：<textarea cols=""（横向字符个数） rows=""（纵向行数）>输入的内容会出现在此</textarea>

2、按钮

<form>

账号：<input type="text" value="张三" disabled="disabled" /><br />

密码：<input type="password" /><br />

<input type="submit" value="提交信息" />

&nbsp;<input type="reset" disabled="disabled" /><br />

<input type="button" value="登入，未设置，无实际作用" /><br />

<input type="image" src="魔兽世界1.jpg" width=""  />

</form>

按钮

提交按钮：<input type="submit"  value="" />   提交，对于整个表单进行获取，并进行上传，必须在表单内才能起作用（value值是显示按钮上的信息）

重置按钮：<input type="reset" />  针对整个表单进行重置

普通按钮：<input type="button" />  普通按钮

图片按钮：<input type="image" src="图片地址" />  默认与提交一样

<disabled="disabled"  />  是输入的信息不可更改或按钮失效

3、选择输入

<form>

<input type="radio" name="sex" checked="checked" />男&nbsp;

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

<br />

<input type="checkbox" checked="checked" disabled="disabled" />可口可乐<br />

<input type="checkbox"  />百事可乐<br />

<input type="checkbox"  />雪碧<br />

<input type="checkbox"  />芬达<br /><br />

<br />

<input type="file"  /><br />

<br />

<select size="" >

<option value="" >可口可乐</option>

<option value="" >百事可乐</option>

<option value="" >雪碧</option>

<option value="" >芬达</option>

</select>

</form>

选择输入、下拉列表

单选按钮组：<input type="radio" name="one" checked="checked" /> 内容       单选按钮组，name的值用来分组，checked设置为默认值

多选按钮：<input type="checkbox" />内容

上传文件：<input type="file" >       用来上传文件

下拉菜单列表：<select size="1" >   size为1时，为菜单；size>1时，为列表

<option value="1" >内容</option>

<option value="2" selected="selected" >内容</option>    selected为默认值

</select>

练习题

<body background="绿色线条.jpg" >

<table width="" height="" border="" align="center">

<tr align="center">

<td colspan=""><font size="+2"><b>账户注册</b></font></td>

</tr>

<tr>

 <td width="">邮箱：</td>

 <td>

  <form>

  <input type="text"  />

  </form>

 </td>

</tr>

<tr>

 <td></td>

 <td>需要通过邮箱激活账户，不支持sohu，21cn，sougou的邮箱</td>

</tr>

<tr>

 <td>登入用户名：</td>

 <td>

  <form>

  <input type="text" />

  </form>

 </td>

</tr>

<tr>

 <td></td>

 <td>仅在登入时使用，字符不少于4个</td>

</tr>

<tr>

 <td>显示名称：</td>

 <td>

 <form>

 <input type="text" />

 </form>

 </td>

</tr>

<tr>

 <td></td>

 <td>即昵称，字符数不少于2个</td>

</tr>

<tr>

 <td>密码：</td>

 <td>

 <form>

 <input type="password" />

 </form>

 </td>

</tr>

<tr>

 <td>确认密码：</td>

 <td>

 <form>

 <input type="password" />

 </form>

 </td>

</tr>

<tr>

 <td></td>

 <td>至少8位，包含字符、数字、特殊字符</td>

</tr>

<tr>

 <td>性别：</td>

 <td>

 <form>

 <input type="radio" checked="checked" />男&nbsp;

 <input type="radio"  />女

 </form>

 </td>

</tr>

<tr>

 <td>喜好：</td>

 <td>

 <form>

 <input type="checkbox" />音乐&nbsp;

 <input type="checkbox" />美术&nbsp;

 <input type="checkbox" />运动&nbsp;

 <input type="checkbox" />手工<br />

 <input type="checkbox" />逛街&nbsp;

 <input type="checkbox" />网购&nbsp;

 <input type="checkbox" />美食&nbsp;

 <input type="checkbox" />烹饪<br />

 <input type="checkbox" />阅读&nbsp;

 <input type="checkbox" />游戏&nbsp;

 <input type="checkbox" />健身&nbsp;

 <input type="checkbox" />美容

 </form>

 </td>

</tr>

<tr>

 <td>家庭住址：</td>

 <td>

 <form>

 <select size="" >

 <option>—请选择—</option>

 <option>张店区</option>

 <option>淄川区</option>

 <option>博山区</option>

 <option>临淄区</option>

 <option>周村区</option>

 <option>沂源县</option>

 <option>桓台县</option>

 <option>高青县</option>

 <option>高新区</option>

 <option>文昌湖风景旅游区</option>

 </select>

 </form>

 </td>

</tr>

<tr align="center">

<td colspan="">

 <form>

 <input type="submit" value="提交信息" />

 &nbsp;&nbsp;&nbsp;&nbsp;

 <input type="reset" value="重新填写" />

 </form>

</td>

</tr>

</table>

</body>

练习题

HTML-★★★★★表单★★★★★的更多相关文章

  1. ASP.NET Aries 入门开发教程9：业务表单的开发

    前言: 经过前面那么多篇的列表的介绍,终于到了大伙期待的表单开发了. 也是本系列的最后一篇文章了! 1:表单页面的权限设置与继承 对于表单页面,权限的设置有两种: 1:你可以选择添加菜单(设置为不显示 ...

  2. 探索ASP.NET MVC5系列之~~~3.视图篇（下）---包含常用表单和暴力解猜防御

    其实任何资料里面的任何知识点都无所谓,都是不重要的,重要的是学习方法,自行摸索的过程(不妥之处欢迎指正) 汇总:http://www.cnblogs.com/dunitian/p/4822808.ht ...

  3. jQuery学习之路（8）- 表单验证插件-Validation

    ▓▓▓▓▓▓ 大致介绍 jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 ...

  4. jQuery学习之路（5）- 简单的表单应用

    ▓▓▓▓▓▓ 大致介绍 接下来的这几个博客是对前面所学知识的一个简单的应用,来加深理解 ▓▓▓▓▓▓ 单行文本框 只介绍一个简单的样式:获取和失去焦点改变样式 基本结构: <form actio ...

  5. 12、Struts2表单重复提交

    什么是表单重复提交 表单的重复提交: 若刷新表单页面, 再提交表单不算重复提交. 在不刷新表单页面的前提下: 多次点击提交按钮 已经提交成功, 按 "回退" 之后, 再点击 &qu ...

  6. .net erp（办公oa）开发平台架构概要说明之表单设计器

    背景:搭建一个适合公司erp业务的开发平台.   架构概要图: 表单设计开发部署示例图    表单设计开发部署示例说明1)每个开发人员可以自己部署表单设计至本地一份(当然也可以共用一套开发环境,但是如 ...

  7. javascript表单的Ajax 提交插件的使用

    Ajax 提交插件 form.js 表单的下载地址:官方网站:http://malsup.com/jquery/form/ form.js 插件有两个核心方法:ajaxForm()和ajaxSubmi ...

  8. 玩转spring boot——AOP与表单验证

    AOP在大多数的情况下的应用场景是:日志和验证.至于AOP的理论知识我就不做赘述.而AOP的通知类型有好几种,今天的例子我只选一个有代表意义的“环绕通知”来演示. 一.AOP入门 修改“pom.xml ...

  9. from表单提交数据之后，后台对象接受不到值

    如果SSH框架下,前段页面通过from表单提交数据之后,在后台对象显示空值,也就是接收不到值得情况下.首先保证前段输入框有值,这个可以在提交的时候用jQuery的id或者name选择器alert弹出测 ...

  10. form表单验证-Javascript

    Form表单验证: js基础考试内容,form表单验证,正则表达式,blur事件,自动获取数组,以及css布局样式,动态清除等.完整代码如下: <!DOCTYPE html PUBLIC &qu ...

随机推荐

  1. DOM0级与DOM2级

    定义: 0级DOM 分为2个:一是在标签内写onclick事件  二是在JS写onlicke=function(){}函数 1) <input id="myButton" t ...

  2. PythonQt第一例

    pythonQt第一例源码如下,主要介绍了简单的使用方式,需要注意的是应用程序的debug版本和release版本必须使用同类型的PythonQt库不可交叉使用. 源码地址:http://files. ...

  3. ubuntu14.04安装chromium以及flash插件

    之前找了好几个方法都不还用,今天突然发现,还挺简单的.命令如下: sudo apt-get updatesudo apt-get install chromium-browser#sudo add-a ...

  4. linux的“自动化”-乾颐堂CCIE

    linux系统的web网站在运营状态时,我们常需要对网站进行维护,例如查看资源剩余并做出响应.日志分割.数据整理,在特定状态执行特定任务等等,这些都会需要linux能实现自动执行某些任任务.本篇博文介 ...

  5. vs2012安装qt5.5.1

    https://blog.csdn.net/a6513806/article/details/80098057

  6. Spring Boot☞ 使用Spring-data-jpa简化数据访问层

    效果图: 代码区: package com.wls.integrateplugs.jpa.primary.model; /** * Created by wls on 2017/8/24. */ im ...

  7. Spring MVC 配置文件

    <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.spr ...

  8. Smarty的循环

    (1)section.sectionelse功能多,参数多.或许不是太实用.是smarty用来做循环操作的函数之一.(2)了解基本属性name和loop <section name=articl ...

  9. Exception (1) Understanding Exception Handling

    When an exception is thrown, it cannot be ignored--there must be some kind of notification or termin ...

  10. 一个简单的编译tex的Makefile

    tex编译成pdf通常要经过以下步骤:tex-->dvi-->ps-->pdf.如果修改了tex文件想看一下效果,就要把命令重新敲一遍.虽然就几行命令,反复敲还是很烦人的.最直接的办 ...