Html Body中table(表格)也是一个重要组成部分,下面列举一个简单的实例:

——————————————简单的table——————————————————

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table width="90%" border="" cellpadding="" cellspacing="" align="center">
<caption>
<h1>维修项目增补单</h1>
<tr align="">
<th>工单号</th>
<th colspan="">__________</th>
<th>车牌号</th>
<th colspan="">__________</th>
<th>车型</th>
<th></th>
<th>技师</th>
<th></th>
<th>维修时间</th>
<th colspan="">___________</th>
</tr>
<tr>
<th>序号</th>
<th colspan="">维修项目及更换配件</th>
<th>单价</th>
<th>数量</th>
<th>小计</th>
<th>工时费</th>
<th>合计</th>
<th colspan="">故障原因</th>
</tr>
<tr>
<th></th>
<td colspan=""></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan=""></td>
</tr>
<tr>
<th></th>
<td colspan=""></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan=""></td>
</tr>
<tr>
<th></th>
<td colspan=""></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan=""></td>
</tr>
<tr>
<th></th>
<td colspan=""></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan=""></td>
</tr>
<tr>
<th></th>
<td colspan=""></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan=""></td>
</tr>
<tr>
<th></th>
<td colspan=""></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td colspan=""></td>
</tr>
<tr align="left">
<th colspan="">备件费用小计:</th>
<th colspan="">工时费用小计:</th>
<th colspan="">合计:</th>
<tr />
</caption>
</table>
</body>
</html>

效果如下:

!:有一个非常需要注意的地方就是因为html内容为主的原因,当你空单元格位置又是不会像你设置那样完整展开。暂时没有找到解决办法,只能将空单元格中加入字符,使他完整展开。

——————————————————————From表单————————————————————————————

From表单是Html中用户与网站交互的手段。

表单是可以把浏览者输入的数据传送到服务器端的程序(比如ASP,PHP,JSP)的HTML元素,服务器端程序可以处理表单传过来的数据,从而进行一些动作.比如,bbs,blog的登陆系统,购物车系统等.

以下举例:

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>淘宝注册</title>
</head>
<body>
<table align="center" width="" border="" cellpadding="" cellspacing="">
<caption>
<h2>用户注册</h2>
</caption>
<form action="http://www.baidu.com" method="POST">
<tr> <!-- 使用输入域定义姓名输入框 -->
<td>姓名:</td>
<td>
<input type="TEXT" name="one" size=""/>
</td>
</tr>
<tr> <!-- 使用单选按钮域定义性别输入框 -->
<td>密码:</td>
<td>
<input type="PASSWORD" name="one" size=""/>
</td>
</tr>
<tr>
<td>性别:</td>
<td>
<input type="radio" name="sex" size=""/>男
<input type="radio" name="sex" size=""/>女
<input type="radio" name="sex" size=""/>保密
</td>
</tr>
<tr> <!-- 使用下拉列表域定义学历输入框 -->
<td>学历:</td>
<td>
<select id="" name="edu">
<option>--请选择--</option>
<option value="">高中</option>
<option value="">大专</option>
<option value="">本科</option>
<option value="">研究生</option>
<option value="">其他</option>
</select>
</td>
</tr>
<tr> <!-- 使用复选按钮域定义爱好输入框 -->
<td>爱好:</td>
<td>
<input type="checkbox" name="two" value=""/>跑步
<input type="checkbox" name="two" value=""/>羽毛球
<input type="checkbox" name="two" value=""/>篮球
<input type="checkbox" name="two" value=""/>乒乓球
</td>
</tr>
<tr> <!-- 使用多行文本输入域定义自我描述输入框 -->
<td>自我描述:</td>
<td>
<textarea id="" name="there" rows="" cols=""></textarea>
</td>
</tr>
<tr> <!-- 定义提交和重置两个按钮 -->
<td colspan="" align="center">
<input type="SUBMIT" name="SUBMIT" value="提交"/>
<input type="RESET" name="RESET" value="重置"/>
</td>
</tr> </form>
</table>
</body>
</html>

效果如下:

因为初步接触,做一下简单的还可以,再难一点就有困难了。

html_table标签和from表单标签小试手的更多相关文章

  1. [转]SpringMVC<from:form>表单标签和<input>表单标签简介

    原文地址:https://blog.csdn.net/hp_yangpeng/article/details/51906654 在使用SpringMVC的时候我们可以使用Spring封装的一系列表单标 ...

  2. Struts2_day04--自定义拦截器_Struts2的标签库_表单标签

    自定义拦截器 1 在struts2里面有很多的拦截器,这些拦截器是struts2封装的功能,但是在实际开发中,struts2里面的拦截器中可能没有要使用的功能,这个时候需要自己写拦截器实现功能 2 拦 ...

  3. SpringMVC from 表单标签和 input 表单标签

    刚学习很懵  不知道还有springmvc 自己的表单  于是乎就上网查了一下  这个真的好用多啦 刚学习很懵  不知道还有springmvc 自己的表单  于是乎就上网查了一下  这个真的好用多啦 ...

  4. SpringMVC学习系列(11) 之 表单标签

    本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图上展示WebModel中的数据更加轻松. 一.首先我们先做一个简单了例子来对Spring MV ...

  5. struts2:非表单标签

    非表单标签主要用于输出在Action中封装的信息,这在实际运用中是很常见的. 1. actionerror标签 <s:actionerror>标签主要用于输出错误信息到客户端,该标签将Ac ...

  6. SpringMVC学习系列 之 表单标签

    http://www.cnblogs.com/liukemng/p/3754211.html 本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图 ...

  7. SpringMVC表单标签

    SpringMVC学习系列(11) 之 表单标签   本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图上展示WebModel中的数据更加轻松. ...

  8. springMVC(7)---表单标签

    springMVC(7)---表单标签 form标签作用                                     简单来讲form表单有两大作用 1:第一就是往后端提交数据或者前端回显 ...

  9. struts2:表单标签

    目录 表单标签1. form标签2. submit标签3. checkbox标签4. checkboxlist标签5. combobox标签6. doubleselect标签7. head标签8. f ...

随机推荐

  1. 多组 RadioButtonList 获取值

    <div class="row">    <table>        <thead><tr><th>操作</th ...

  2. 关于 Unity UI 中 GraphicRaycaster.Raycast 数量巨大的问题

    有时候会发现 Unity UI 非常耗时,在 Profiler 中可以轻易的看到 UI 中 的 GraphicRaycaster.Raycast 单帧调用可以成百上千,甚至好几千,帧速率前不忍赌,一关 ...

  3. HW3.15

    import java.util.Scanner; public class Solution { public static void main(String[] args) { int lotte ...

  4. C++ Primer 练习7.32(C++ Primer读书笔记)

    第七章 类 练习7.32  定义你自己的Screen和Window_mgr,其中clear是Window_mgr的成员,是Screen的友元. 由于Window_mgr中含有Screen对象,所以在W ...

  5. 问题-Delphi编译到最后Linking时总是出现与ntdll.dll有关的错误还有Fatal Error Out of memory错误

    1.跳出错误法  ===================================================在主界面的implementation  {$R *.dfm} 下放入以下代码: ...

  6. [一]初识JFreeChart

    是什么? Java报表工具 原理? 封装好数据,调用工厂,创建一张图片,返回一个图片的名字,直接在页面上显示即可 怎么做? 需要导入jar,并在web.xml文件中进行相关的配置即可

  7. grub名词理解

    http://baike.baidu.com/link?url=HDv2WL37x1EBS51pCHqbGQIFx7aAJ91h-0afrjOy1UH6MjhKUFPnvjNkOU32OHdVoTS7 ...

  8. 使用CSS3(一)

    开发商前缀(vendor prefix) 前缀 浏览器 -moz- Firefox -webkit- Chrome和Safari(它们的引擎都是WebKit) -ms- Internet Explor ...

  9. Kali无法定位软件包的解决方案

    异常处理汇总-服 务 器 http://www.cnblogs.com/dunitian/p/4522983.html 以前遇到过,后来好久没碰Linux了,忘记了.之后上网搜了一下....呃,发现解 ...

  10. Webdriver:Unsupported Marionette protocol version 2, required 3

    升级到firefox到47以上版本即可 坑人的Mozilla不能起个我们熟识的名字吗? 先是webdriver.gecko.driver后是Marionette protocol.   1.WebDr ...