表单练习(回顾)

思维导图:


课表代码:

<body>
	<table width="600" border="1" align=‘center‘ bordercolor="blue" rules=‘all‘>
		<caption><b>课程表</b></caption>
		<tr>
			<th>项目</th>
			<th colspan="6">上课</th>
			<th>休息</th>
		</tr>
		<tr>
			<th>星期</th>
			<th>星期一</th>
			<th>星期二</th>
			<th>星期三</th>
			<th>星期四</th>
			<th>星期五</th>
			<th>星期六</th>
			<th>星期天</th>
		</tr>
		<tr>
			<td rowspan=‘4‘>上午</td>
			<td>语文</td>
			<td>数学</td>
			<td>化学</td>
			<td>计算机</td>
			<td>语文</td>
			<td>数学</td>
			<td rowspan=‘4‘ align=‘center‘>休息</td>
		</tr>
		<tr>

			<td>数学</td>
			<td>语文</td>
			<td>英语</td>
			<td>体育</td>
			<td>高数</td>
			<td>物理</td>

		</tr>
		<tr>

			<td>生物</td>
			<td>人体研究</td>
			<td>人体艺术</td>
			<td>基因交流</td>
			<td>表演</td>
			<td>演讲</td>

		</tr>
		<tr>

			<td>语文</td>
			<td>数学</td>
			<td>化学</td>
			<td>高数</td>
			<td>历史</td>
			<td>地理</td>

		</tr>
		<tr>
			<td colspan=‘8‘ align=‘center‘ bgcolor=‘#ccc‘>午休</td>
		</tr>
		<tr>
			<td rowspan=‘2‘>下午</td>
			<td>化学</td>
			<td>英语</td>
			<td>数学</td>
			<td>高数</td>
			<td>语文</td>
			<td>计算机</td>
			<td rowspan=‘2‘ align="center">休息</td>
		</tr>
		<tr>

			<td>体育</td>
			<td>语文</td>
			<td>化学</td>
			<td>体育</td>
			<td>计算机</td>
			<td>英语</td>
		</tr>
		<tr>
			<td colspan=‘8‘>总计:</td>

		</tr>
	</table>
</body>

运行结果:


表单:

代码:

<body>
<form action=‘index.php‘ method=‘post‘>
 <table align=‘center‘  width=‘900‘ border=‘1‘  bgcolor=‘#b4b4b4‘ cellspacing=‘0‘cellpadding=‘1‘ >
    <tr bgcolor=‘#ccc‘>
        <td colspan=‘3‘ bgcolor=‘#7f7f7f‘><b>1.会员登陆名和密码</b></td>
    </tr>
    <tr>
        <td align=‘right‘>用户名:</td>
        <td  colspan=‘2‘>
            <input type=‘text‘ name=‘username‘ />
            <font size=‘1‘ color=‘red‘>*</font>
            <input type=‘button‘ value=‘检测用户名‘ />
            <font size=‘1‘ color=‘blue‘>5-15位,请使用英文字母(a-z;A-Z)数字(1~9)</font>
        </td>
    </tr>
    <tr>
        <td align=‘right‘>密 码:</td>
        <td>
            <input type=‘password‘ name=‘pwd‘ />
        </td>
        <td>
            <table cellspacing=‘0‘cellpadding=‘0‘>
                <tr>
                    <td><font size=‘1‘ color=‘red‘>*</font>    </td>
                    <td><font size=‘1‘ color=‘blue‘ >5-15位,请使用英文字母(a-z;A-Z)数字(1~9);注意区分大小写;<br>
            密码不能与登陆名相同;易记;难猜……
            </font></td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td align=‘right‘>再次输入密码:</td>
        <td colspan=‘2‘>
            <input type=‘password‘ name=‘pwd‘ />
            <font size=‘1‘ color=‘red‘>*</font>
            <font size=‘1‘ color=‘blue‘>两次输入的密码必须一致</font>
        </td>
    </tr>
    <tr bgcolor=‘#ccc‘>
        <td colspan=‘3‘ bgcolor=‘#7f7f7f‘><b>2.姓名和联系方式</b></td>
    </tr>
    <tr>
        <td align=‘right‘>真实姓名:</td>
        <td colspan=‘2‘>
            <input type=‘text‘ name=‘zhengming‘ />
            <font size=‘1‘ color=‘red‘>*</font>
            男:<input type=‘radio‘ name=‘sex‘ value=‘男‘ />
            女:<input type=‘radio‘ name=‘sex‘ value=‘女‘ />
        </td>
    </tr>
    <tr>
        <td align=‘right‘>电子邮箱:</td>
        <td><input type=‘text‘ name=‘email‘ /></td>
        <td>
            <table cellspacing=‘0‘ cellpadding=‘0‘>
                <tr>
                    <td><font size=‘1‘ color=‘red‘>*</font></td>
                    <td><font size=‘1‘ color=‘red‘>非常重要!</font><br>
                    <font size=‘1‘ color=‘blue‘>这是客户与您联系的首选方式;请一定填写真实</font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td align=‘right‘>固定电话:</td>
        <td colspan=‘2‘>
            <input type=‘text‘ name=‘tel‘ />
            <font size=‘1‘ color=‘red‘>*</font><font size=‘1‘ color=‘blue‘>区号+电话号码</font>
        </td>

    </tr>
    <tr>
        <td align=‘right‘>公司所在地址:</td>
        <td colspan=‘2‘>
            <select name=‘address‘>
                <option value=‘#‘> 北京</option>
                <option  value=‘#‘>上海</option>
                <option  value=‘#‘>广州</option>
                <option  value=‘#‘>深圳</option>
            </select>
                <select name=‘address‘>
                <option value=‘#‘>东城</option>
                <option  value=‘#‘>海淀</option>
                <option  value=‘#‘>朝阳</option>
            </select>
        </td>
    </tr>
    <tr>
        <td align=‘right‘>街道地址:</td>
        <td colspan=‘2‘>
            <input type=‘text‘ name=‘chuanzhen‘ size=‘50‘ />
            <font color=‘red‘>*</font><font size=‘1‘ color=‘blue‘>填写县(区)、街道、门牌号</font>
        </td>
    </tr>
    <tr>
        <td align=‘right‘  width=‘130‘>传真号码:</td>
        <td width=‘180‘><input type=‘text‘ name=‘chuanzhen‘ /></td>
    </tr>
    <tr>
        <td align=‘right‘>电话号码:</td>
        <td><input type=‘text‘ name=‘dhhm‘ /></td>
    </tr>
    <tr>
        <td align=‘right‘>邮政编码:</td>
        <td ><input type=‘text‘ name=‘yzbm‘ /></td>
    </tr>
    <tr bgcolor=‘#ccc‘>
        <td colspan=‘3‘ bgcolor=‘#7f7f7f‘><b>3.公司名称和主营业务</b></td>
    </tr>
    <tr>
        <td align=‘right‘>贵公司名称:</td>
        <td>
            <input type=‘text‘ name=‘companyname‘ />
        </td>
        <td>
            <table cellspacing=‘0‘ cellpadding=‘0‘>
                <tr>
                    <td><font size=‘1‘ color=‘red‘>*</font></td>
                    <td><font size=‘1‘ color=‘blue‘>请填写在工商局注册的名称;<br>无商号的个体经营者填写执照上的姓名,如张三(个体经营)</font></td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td align=‘right‘>您的职位:</td>
        <td colspan=‘2‘>
            <input type=‘text‘ name=‘companyname‘ />
            <font size=‘1‘ color=‘red‘>*</font>
        </td>

    </tr>
    <tr>
        <td align=‘right‘>固定电话:</td>
        <td colspan=‘2‘>
            <input type=‘text‘ name=‘tel‘ />
            <font size=‘1‘ color=‘red‘>*</font><font size=‘1‘ color=‘blue‘>区号+电话号码</font>
        </td>

    </tr>
    <tr>
        <td align=‘right‘>主营行业:</td>
        <td colspan=‘2‘>
            <select name=‘gougou‘>
                <option  value=‘#‘>电子电工</option>
                <option  value=‘#‘>服装经营</option>
                <option  value=‘#‘>娱乐</option>
                <option  value=‘#‘>旅游</option>
            </select>
            <font size=‘1‘ color=‘blue‘>请正确选择,您会收到该行业的供求信息</font>
        </td>
    </tr>
    <tr>
        <td align=‘right‘>主营产品/服务:</td>
        <td colspan=‘2‘>
            <input type=‘text‘ name=‘tel‘ size=‘40‘ />
            <font size=‘1‘ color=‘red‘>*</font><font size=‘1‘ color=‘blue‘>3个主要产品名/服务名,最少要填一个,例如:太阳能、拉链、布料</font>
        </td>
    </tr>
    <tr>
        <td align=‘right‘>公司网址:</td>
        <td colspan=‘2‘><input type=‘text‘ name=‘tel‘ size=‘40‘ value=‘http://‘ /></td>

    </tr>
    <tr>
        <td></td>
        <td colspan=‘2‘ bgcolor=‘#7f7f7f‘><input type=‘image‘ src=‘submit.png‘ /></td>
    </tr>
    <tr>
        <td colspan=‘3‘ align=‘center‘><b>备注:<font color=‘red‘>*</font>为必填项</b></td>
    </tr>
 </table>
 </form>
</body>

运行结果:

时间: 2024-10-06 21:52:58

表单练习(回顾)的相关文章

第七节 认识SpringMVC中的表单标签

所谓成熟,就是:你要习惯,任何人的忽冷忽热:也要看淡,任何人的渐行渐远: --胖先生 SpringMVC的表单标签 回顾: JSTL标签 --C标签 FMT标签 自学:JSP如何自定义标签[开源社区当中有别人写好的标签] 表单标签:使用规则 模拟开发环境: 1.更新操作 A.通过主键进行查询 B.JSP显示 C.提交表单 @RequestMapping(value="/update/{user_id}",method=RequestMethod.GET) public ModelAnd

jQuery几个经典表单应用整理回顾

1.文本框获得(失去)焦点 当文本框获得输入焦点时,将该文本框高亮显示,算不得一个应用,只是一个小技巧,可以提高用户体验. [html] view plaincopy <span style="font-family:SimSun;font-size:12px;"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xht

项目回顾1-图片上传-form表单还是base64-前端图片压缩

第一个项目终于上线了,是一个叫亲青筹的公益众筹平台,微信端,电脑端还有后台界面大部分都是我完成的,几个月过来,感觉收获了很多,觉得要总结一下. 首先想到的是图片上传的问题.在通常表单数据都是ajax上传的情况下,为了上传图片而去使用form表单感觉很蠢.然后那时候也没有想到用jquery form插件. 后台的同事给的方案是用iframe里写一个form表单,然后上传图片之后自动提交表单,他将图片在服务器上的地址以跳转页url的一部分,我再来截取的方式. 方案一:iframe+form表单 <f

基于Extjs的web表单设计器

由于这样工作和自身的一些原因很长一段时间没有写过博客了.最近想把自己前面一段时间搞出的一个表单设计器的相关经验或者经历记录下来.分享给大家,也算是对自己前2个月的一个总结回顾吧. 首先介绍一下开发此版本的表单设计器的原因及背景.该项目是公司为中国某大型国有企业开发网上经费报销系统,主要是处理改集团及其二级单位,三级单位等子分公司的各种日常经费报销,预算控制及其他常用业务审批(比如:备用金借支.出差申请及差旅费报销.合同管理.资产调拨等).系统主要由两个最重要的部分组成一个WF流程设计及流程引擎—

struts2 防止表单的重复提交

防止表单重复提交(拦截器) 1.回顾之前的解决办法: 2.Struts2中的解决办法: 2.1.使用重定向 <result type="redirect">/success.jsp</result> 遗留的问题:防不住后退,再提交. 2.2.使用<s:token/>生成令牌配合token拦截器 1 <%@ page language="java" import="java.util.*" pageEnco

Day17 表单验证、滚动菜单、Django

一.表单验证的两种实现方式 1.DOM绑定 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表单验证(DOM绑定)</title> <style> .item{ width: 250px; height: 60px; position: relative; } .item input{ wid

python带cookie提交表单自动登录(转)

今天突然把博客给申请了,以前也想过的,奈于自己觉得水平还太低有点不好意思写博客,但是后来一想,自己的记录所学,加深印象,主要还是为了学习进步,不怕丢人!今天就稍微回顾一下这两天写的一段用python模拟浏览器登录自己学校官网的代码吧(多亏大神指导了). 1 import urllib 2 import urllib2 3 import cookielib 4 5 login_url = "xxxxxxxxxxxxx" 6 7 cj = cookielib.CookieJar()#实例化

(二十二)Struts2 表单标签

表单标签列表是Struts UI标签的子集.这些标签有助于渲染Struts Web应用程序所需的用户界面,主要分为三类,本章将介绍这三种类型的UI标签: 简单UI标签 我们其实已经在前面的示例中使用了这些标签,接下来将在本章中重新回顾一下.以下是一个简单的视图页面email.jsp与几个简单的UI标签: <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncodi

使用Angular提交表单

使用Angular提交表单 我们准备在之前使用的<script>标签中设置我们的Angular应用.所以删除里面的内容,我们就可以开始了. 设置一个Angular应用 步骤为: 1. 加载Angular 2. 设置module 3. 这是controller 4. 将module和controller应用于HTML 5. 设置双向变量绑定 6. 这是错误和信息 看起来好像是很多内容,但是最终,我们会用非常少的代码,并且看起来会非常简洁.另外,创建带有更多输入更大的表单,也会更容易. Angul