<!DOCTYPE html>
 <html>
     <head>
         <meta charset="UTF-8">
         <title>表单的使用</title>
     </head>
     <body>
         <h2 align="center"><font color="red" size="5">用户信息表填写</font></h2>
         <hr width="820" size="5" color="aquamarine"/>
         <br />
         <!-- 表单的使用     -->
         <form action="#" method="post">
             <table border="1" bordercolor="gainsboro" width="800" height="610" cellpadding="5"  cellspacing="0" align="center">
                 <tr>
                     <th colspan="3" bgcolor="gainsboro" align="left" >1. 用户名和密码</th>
                 </tr>
                 <tr>
                     <td width="120">会员名:</td>
                     <td><input type="text" name="userName" /><font color="red">*</font></td>
                     <td><input type="button" value="检查用户" value="butt"/><font color="blue">&nbsp;5-15位&nbsp;&nbsp;大小字母和数字组合</font></td>
                 </tr>
                 <tr>
                     <td>密　码:</td>
                     <td><input type="password" name="password" /><font color="red">*</font></td>
                     <td><font color="blue">5-15位&nbsp;&nbsp;大小字母和数字组合,不能与用户名相同</font></td>
                 </tr>
                 <tr>
                     <td>再次输入密码:</td>
                     <td><input type="password" name="password" /><font color="red">*</font></td>
                     <td><font color="blue">两次密码需一致</font></td>
                 </tr>
                 <tr>
                     <th colspan="3" align="left" bgcolor="gainsboro">2.姓名和联系方式</th>
                 </tr>
                 <tr>
                     <td>真实姓名:</td>
                     <td><input type="text" name="name" /><font color="red">*</font> </td>
                     <td>汉子<input type="radio" name="sex" value="男" checked="checked"/>妹子<input type="radio" name="sex" value="女"/></td>
                 </tr>
                 <tr>
                     <td>电子邮箱:</td>
                     <td><input type="email" name="email" /><font color="red">*</font></td>
                     <td><font color="red">非常重要!</font>!<br><font color="blue">这是首选的联系方式,请认真填写</font></td>
                 </tr>
                 <tr>
                     <td>固定电话:</td>
                     <td><input type="number" name="phone" /></td>
                     <td><font color="blue">区号+电话号码</font></td>
                 </tr>
                 <tr>
                     <td>传真号码:</td>
                     <td colspan="2"><input type="number" name="portraiture_phone" /></td>
                 </tr>
                 <tr>
                     <td>手机号码:</td>
                     <td colspan="2"><input type="number" name="call" /><font color="red">*</font></td>
                 </tr>
                 <tr>
                     <td>邮政编码:</td>
                     <td colspan="2"><input type="number" name="postal" /></td>
                 </tr>
                 <tr>
                     <td>公司所在地:</td>
                     <td colspan="2">
                         <select name="city">
                             <option value="beijing">北京</option>
                             <option value="shanghai">上海</option>
                             <option value="guangzhou" selected="selected">广州</option>
                             <option value="shenzhen">深圳</option>
                         </select>
                         <select name="city_classify">
                             <option value="tianhe">天河</option>
                             <option value="jishan" selected="selected">吉山</option>
                             <option value="chuanzhi">传智</option>
                             <option value="mengxiang">梦想公寓</option>
                         </select>
                     </td>
                 </tr>
                 <tr>
                     <td>街道地址:</td>
                     <td><input type="text" name="street" /><font color="red">*</font></td>
                     <td><font color="blue">请填写县(区)</font></td>
                 </tr>
                 <tr>
                     <th colspan="3" align="left" bgcolor="gainsboro">3.公司名称和主营业务</th>
                 </tr>
                 <tr>
                     <td>公司名称:</td>
                     <td><input type="text" name="corporate_name" /> <font color="red">*</font></td>
                     <td><font color="blue">请填写在工商部门注册的商号全称</font></td>
                 </tr>
                 <tr>
                     <td>您的职位</td>
                     <td  colspan="2"><input type="text" name="position" /> <font color="red">*</font></td>
                 </tr>
                 <tr>
                     <td>公司网址:</td>
                     <td colspan="2"><input type="url" name="url"  value="http://"/></td>
                 </tr>
                 <tr>
                     <td>主营产品/服务</td>
                     <td><input type="text" name="classification" /></td>
                     <td><font color="blue">3个主营产品名称</font></td>
                 </tr>
                 <tr>
                     <td>主营行业</td>
                     <td >
                        <select name="trade">
                             <option value="commerce">电子商务</option>
                             <option value="electrical">电子电工</option>
                             <option value="new">新闻媒体</option>
                             <option value="hotel">酒店服务</option>
                         </select>
                     </td>
                     <td><font color="blue">请正确选择</font></td>
                 </tr>
                 <tr>
                     <td colspan="3" align="center"><input type="image"  src="data:images/test.png"/></td>
                 </tr>
             </table>
         </form>
         <br/>
     </body>
 </html>

浏览器缩放至90%下效果图

html的表单表格...的更多相关文章

  1. js动态控制表单表格

    js动态控制表单表格,这里操作只讲,添加一行,删除一行,删除某一行某一列. 直接放代码: <!DOCTYPE html> <html> <head> <met ...

  2. HTML 学习笔记 JQuery（表单,表格 操作）

    表单应用 一个表单有3个基本组成部分 (1)表单标签:包含处理表单数据所用的服务器端程序URL 以及数据提交到服务器的方法 (2)表单域:包含文本框 密码框 隐藏框 多行文本框 复选框 单选框 下拉选 ...

  3. Html 表单表格 form table

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

  4. HTML&CSS精选笔记_表格与表单

    表格与表单 表格标记 创建表格 要想创建表格,就需要使用表格相关的标记 <table>     <tr>     <td>单元格内的文字</td>   ...

  5. DHTMLX 前端框架 建立你的一个应用程序 教程(八)-- 添加表单Form

    添加表单Form 我们下一步是在页面中添加一个表单,表格中的选中字段将会显示在表单中.提供一个提交按钮 可以对显示的数据进行修改提交. 添加表单到布局单元格中 1.在右侧布局中使用attachForm ...

  6. java中将表单转换为PDF

    经过网上搜索大概有三种方式:PDF模板数据填充,html代码转换pdf,借用wkhtmltopdf工具 一 .PDF模板数据填充 1.新建word,在word中做出和表单一样的布局的空表单,然后另存为 ...

  7. 基于表单布局：分析过时的table结构与当下的div结构

    一些话在前面 最近做了百度前端学院一个小任务,其中涉及到表单布局的问题, 它要处理的布局问题:左边的标签要右对齐,右边的输入框.单选按钮等要实现左对齐. 从开始入门就被告知table布局已经过时了,当 ...

  8. 对pdf 表单域 或文本框的操作---动态填充PDF 文件内容

    前提:需要pdf模板:并且模板内容以pdf 文本框的形式填写 package com.test;import java.io.File;import java.io.FileOutputStream; ...

  9. Bootstrap框架(基础篇)之列表,表格,表单

    继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>… ...

随机推荐

  1. DiskGenius(磁盘分区/数据恢复) 32位 V4.9.1 免费绿色版

    软件名称: DiskGenius(磁盘分区/数据恢复) 32位 软件语言: 简体中文 授权方式: 免费软件 运行环境: Win 32位/64位 软件大小: 19.5MB 图片预览: 软件简介: Dis ...

  2. 创建Properties文件

    /** * 生成Properties文件 * @param map Properties文件的内容,键值对 * @param path Properties文件生成后存放的路径 * @param pr ...

  3. 调皮的R文件，卑鄙的空格

    毕业快一年了,由于公司业务需要,开发岗的我做了一年测试.最近,终于要开始转开发了.于是和小伙伴们合作,做一个备忘录apk.由于之前是做java的,而且差不多一年没碰代码了(这一年主要做测试,虽然有写自 ...

  4. 使用python修改QQ密保（脚本）

    一.基于以下目的: 1.为了增加对Http协议理解能力,对QQ密保修改的请求进行了分析 2.为了锻炼python的编写能力 3.对web综合知识的理解 花了点时间写了这个脚本,下面介绍脚本的过程 二. ...

  5. 手动添加PopMenu出现的问题

    最近在github上找了个比较酷的弹出菜单PopMenu用来做分享页面,demo下载运行OK,于是拖进项目中,一编译就呵呵了.... 一看demo目录,原来这还还引用了其他库,于是把pod下面的pop ...

  6. Visual Studio 2010 使用外部代码格式化工具 AStyle

    其中AStyle.exe 最好自己编译,放置到 Vistual Studio 安装目录\\Common7\\Tools 直接上配置截图: 单文件: 一次性格式化整个工程:

  7. @property、@synthesize和dynamic的用法

    原文:  http://blog.csdn.net/hherima/article/details/8622948 @代表“Objective-C”的标志,证明您正在使用Objective-C语言 O ...

  8. Eclipse中安装Jdk和配置Python

    要借助Eclipse辅助工作,之前安装配置都是同事帮忙弄的,今天有空来整理一下安装配置步骤 一.安装JDK1.下载JDK,安装JDK,安装完毕,配置JDK环境变量  1)我的电脑右键-属性-高级-点击 ...

  9. sqlserver 优化相关

    http://www.cnblogs.com/studyzy/archive/2008/11/24/1339772.html http://blog.csdn.net/dba_huangzj/arti ...

  10. 使用OllyDbg从零开始Cracking CHM

    需要的小伙伴拿走,百度云链接:https://pan.baidu.com/s/1pLJa5dh.另有一些视频资料,太多,需要的可以留言.