一、表单

<form id="" name="" method="post/get" action="负责处理的服务端">id不可重复；name可以重复；get提交有长度限制，并且编码后的内容在地址栏可见，post提交无长度限制，且编码后内容不可见。

</form>

1、文本输入

文本框<input type="text" name="" id="" value=""/>

密码框<input type="password" name="" id="" value=""/>

文本框<textaarea name="" id="" cols=""(字符多少)  rows=""(几行高)></>textarea>

隐藏域<input type="hidden" name="" id="" value=""/>

2、按钮

提交按钮<input type="submit" name="" id="" disable="disable" value=""/>点击后转到form内的提交服务器地址

重置按钮<input type="reset" name="" id="" disable="disable" value=""/>

普通按钮<input type="button" name="" id="" disable="disable" value=""/>

图片按钮<input type="image" name="" id="" disable="disable" value="" src="图片地址"/>

附：

disable ，使按钮失效；enable，使可用

3、选择输入

单选按钮组<input type="radio" name="" id="" checked="checked" value=""/>name的值用来分组；value的值看不见，用来提交给程序；checked，设置默认选项

复选框组<input type="checkbox" name="" id="" checked="checked" value=""/>

文件上传<input type="file" name="" id="">

<label for=""></label>

<label>标签为input元素定义标注（标记）。

label元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在label元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。

<label>标签的for属性应当与相关元素的id属性相同

下拉列表框

<select name =""  id=""  size=""  multiple="multiple">   ------size=1时，为菜单；>1时，为列表；multiple为多选。

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

<option value="值"  selected="selected">内容2</option>------seleted,设为默认

<option value="值">内容3</option>

</select>

二、使用Photoshop来快速制作网页

主要用于美工设计好网页构架后快速提交给用户预览时用的，用的是剪切和保存为HTML方式。

练习：

注册界面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>邮件输入</title>

</head>

<body background="../PS处理/渐变3.png">

<form>

<br />

<br />

<table  width="700px"   border="" cellpadding="" cellspacing="" align="center">

<tr><!--第一行 -->

<td  width="" height="">郵箱：</td>

<td><input type="text" /></td>

</tr>

<tr><!--第二行 -->

<td  width="" height="">&nbsp;</td>

<td><font size="-1" color="#FF00FF">需要通過郵箱激活賬號，不支持Sohu、21cn、sogou郵箱</font></td>

</tr>

<tr><!--第三行 -->

<td  width="" height="">登錄用戶名：</td>

<td><input type="text" /></td>

</tr>

<tr><!--第四行 -->

<td  width="" height=""></td>

<td><font size="-1" color="#FF00FF">僅在登錄時使用，字符數不少於4個</font></td>

</tr>

<tr><!--第五行 -->

<td  width="" height="">顯示名稱：</td>

<td><input type="text" /></td>

</tr>

<tr><!--第六行 -->

<td  width="" height=""></td>

<td><font size="-1" color="#FF00FF">即昵稱，字符數不少於2個</font></td>

</tr>

<tr><!--第七行 -->

<td  width="" height="">密碼：</td>

<td><input type="password"/></td>

</tr>

<tr><!--第八行 -->

<td  width="" height="">確認密碼：</td>

<td><input type="password"/></td>

</tr>

<tr><!--第九行 -->

<td  width="" height=""></td>

<td><font size="-1" color="#FF00FF">至少8位，必須包含字母、數字、特殊字符</font></td>

</tr>

<tr><!--第十行 -->

<td  width="" height="">性別：</td>

<td><select name="sex" size="">

<option value="">男</option>

<option value="">女</option>

</select>

</td>

</tr>

<tr><!--第十一行 -->

<td  width="" height="">喜好：</td>

<td><select name="like" size="" >

<option value="">音樂</option>

<option value="">電影</option>

<option value="">繪畫</option>

</select></td>

</tr>

<tr><!--第十二行 -->

<td  width="" height=""></td>

<td><input type="submit" value="註冊" /></td>

</tr>

</table>

</form>

</body>

</html>

效果图

HTML第二部分表单及使用Photoshop快速制作网页的更多相关文章

  1. C# Json反序列化 C# 实现表单的自动化测试<通过程序控制一个网页> 验证码处理类：UnCodebase.cs + BauDuAi 读取验证码的值(并非好的解决方案) 大话设计模式：原型模式 C# 深浅复制 MemberwiseClone

    C# Json反序列化   Json反序列化有两种方式[本人],一种是生成实体的,方便处理大量数据,复杂度稍高,一种是用匿名类写,方便读取数据,较为简单. 使用了Newtonsoft.Json,可以自 ...

  2. ThinkPHP第二十二天(表单令牌、相对路径、扩展配置载入、$Think获取系统变量、$_SERVER('HTTP_REFERER')前页地址)

    1.表单令牌开启配置 'TOKEN_ON'=>true 2.相对路径:在thinkphp中,存在单入口index.php,所以程序中的根目录都是以index.php所在的文件夹为根目录,故用./ ...

  3. 基于Extjs的web表单设计器 第二节——表单控件设计

    这一节介绍表单设计器的常用控件的设计. 在前面两章节的附图中我已经给出了表单控件的两大分类:区域控件.常用控件.这里对每个分类以及分类所包含的控件的作用进行一一的介绍,因为它们很重要,是表单设计器的基 ...

  4. C# 实现表单的自动化测试<通过程序控制一个网页>

    学历代表你的过去,能力代表你的现在,学习代表你的将来 十年河东,十年河西,莫欺少年穷 学无止境,精益求精 C# 实现表单的自动化测试,这标题看着就来劲!那么,如何通过C#程序控制一个网页呢? 在此,以 ...

  5. ant-design-vue表单生成组件form-create快速上手

    介绍 form-create 是一个可以通过 JSON 生成具有动态渲染.数据收集.验证和提交功能的表单生成器.并且支持生成任何 Vue 组件.结合内置17种常用表单组件和自定义组件,再复杂的表单都可 ...

  6. myeclipse10 .jsp将表单提交给.java（form网页与后台通信初识）

    做毕设需要用到form通信. 以下几张截图来自极课学院 servlet jsp文件 web配置 出现错误: 路径问题 仍然不对,需要再改 <form action="servlet/S ...

  7. ExtJS4.2学习(16)制作表单(转)

    鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-12-10/188.html --------------- ...

  8. angularjs学习第五天笔记（第二篇：表单验证升级篇）

    您好,我是一名后端开发工程师,由于工作需要,现在系统的从0开始学习前端js框架之angular,每天把学习的一些心得分享出来,如果有什么说的不对的地方,请多多指正,多多包涵我这个前端菜鸟,欢迎大家的点 ...

  9. HTML静态网页 图片热点、框架、表单

    图片热点: 规划出图片上的一个区域,可以做出超链接,直接点击图片区域就可以完成跳转的效果. 示例: 网页划区: 在一个网页里,规划出一个区域用来展示另一个网页的内容. 示例: 框架: 1.frames ...

随机推荐

  1. ARM汇编编程概述

    1.为什么需要学些汇编指令 2.ARM汇编指令分类 3.汇编程序框架 4.编程准备 +++++++++++++++++++++++++++++++++++ 1.为什么需要学些汇编指令 bootload ...

  2. java运行期类型鉴定

    运行期类型识别?RTTI? 假如我们有一个基类的引用,这个引用也可以作为子类的引用嘛,现在我们想知道这个引用的类型到底是啥? 当从子类到基类之后有很多的信息都会丢失掉,比如有一个人类的对象可以看成普遍 ...

  3. CUBRID学习笔记 38 net调用java的函数过程

    首先要设置java_stored_procedure 为yes  该配置项在cubrid.conf中 书写并编译java代码 public class SpCubrid{      public st ...

  4. TestNg测试框架使用笔记

    Gradle支持TestNG test { useTestNG(){ //指定testng配置文件 suites(file('src/test/resources/testng.xml')) } } ...

  5. Scrum Meeting---Three(2015-10-27)

    今日已完成任务和明日要做的任务 姓名 今日已完成任务 今日时间 明日计划完成任务 估计用时 董元财 今日我学习了Java Web,同时安装好了我的MySQL 4h 进行数据库设计以及Web项目的创建 ...

  6. 08 高效的SQL

    编写高效 SQL 需要以下知识 有关所查询内容的物理组织的知识 数据库能做什么的知识, 例如: 如果你不知道跳跃扫描索引及其用途, 那么你可能会看着模式说”索引丢了” SQL 所有错综复杂的知识 对目 ...

  7. 在PC端或移动端应用中接入商业QQ的方法

    今天看博友的博客学习了一种很有用的方法: 在页面中需要接入企业的QQ,访问网址:http://shang.qq.com/widget/consult.php.(就是API接口),然后你只需要登录你的Q ...

  8. MyEclipse8.5启动无法选择工作空间的问题

    方法一:打开Window---Preferences---General---Startup and Shutdown,勾选Prompt for workspace on startup 选项,再次登 ...

  9. 巧妙的实现 CSS 斜线(炫酷的小效果)

      开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果 ...

  10. lx：这么空！什么叫假大空 xy：那我做给你看

    “如果我答应你,你回来了XY,最后没有在一起肯定会怪我:而且我现在没有想好以后会怎么样” 希望你可以看到我的努力!PS : 坚持以后每日至少一篇.编程是一门手艺,手艺人靠手艺养家! ---手艺人