html_table标签和from表单标签小试手

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表单标签小试手的更多相关文章

[转]SpringMVC<from:form>表单标签和<input>表单标签简介
原文地址:https://blog.csdn.net/hp_yangpeng/article/details/51906654 在使用SpringMVC的时候我们可以使用Spring封装的一系列表单标 ...
Struts2_day04--自定义拦截器_Struts2的标签库_表单标签
自定义拦截器 1 在struts2里面有很多的拦截器,这些拦截器是struts2封装的功能,但是在实际开发中,struts2里面的拦截器中可能没有要使用的功能,这个时候需要自己写拦截器实现功能 2 拦 ...
SpringMVC from 表单标签和 input 表单标签
刚学习很懵不知道还有springmvc 自己的表单于是乎就上网查了一下这个真的好用多啦刚学习很懵不知道还有springmvc 自己的表单于是乎就上网查了一下这个真的好用多啦 ...
SpringMVC学习系列（11）之表单标签
本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图上展示WebModel中的数据更加轻松. 一.首先我们先做一个简单了例子来对Spring MV ...
struts2：非表单标签
非表单标签主要用于输出在Action中封装的信息,这在实际运用中是很常见的. 1. actionerror标签 <s:actionerror>标签主要用于输出错误信息到客户端,该标签将Ac ...
SpringMVC学习系列之表单标签
http://www.cnblogs.com/liukemng/p/3754211.html 本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图 ...
SpringMVC表单标签
SpringMVC学习系列(11) 之表单标签本篇我们来学习Spring MVC表单标签的使用,借助于Spring MVC提供的表单标签可以让我们在视图上展示WebModel中的数据更加轻松. ...
springMVC(7)---表单标签
springMVC(7)---表单标签 form标签作用简单来讲form表单有两大作用 1:第一就是往后端提交数据或者前端回显 ...
struts2：表单标签
目录表单标签1. form标签2. submit标签3. checkbox标签4. checkboxlist标签5. combobox标签6. doubleselect标签7. head标签8. f ...

随机推荐

HW3.6
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
获取所有组合算法、获取全排列算法（java）
转载声明:原文转自:http://www.cnblogs.com/xiezie/p/5574516.html 受到ACM1015的影响,个人感觉,有必要对统计学上的全组合和全排列进行一个简单的总结 ...
HDU-3622 Bomb Game 2sat
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3622 题意:一个平面上有很多的炸弹,每个炸弹的爆炸范围是一样的,求最大的爆炸范围使得炸弹之间不相互影响 ...
mongodb的优化
1:使用索引 ,同时对索引排序,[比如mongodb对时间做索引都用-1降序哈,这样查询最新的速度很快],注意组合索引中字段的顺序要和查询时字段的顺序一致哈, 用find().explain()检查查 ...
发布ASP（非.Net）网站
1.安装IIS 2.设置网址.端口 3.设置文档(默认访问的文档,比如index.asp,index.htm等) 4.双击asp - 展开行为 - 启用父路径:true - 允许访问父目录 5.应用程 ...
谁才是最快的消息队列:ActiveMQ, RabbitMQ[转]
Lately I performed a message queue benchmark, comparing several queuing frameworks (RabbitMQ, Active ...
Java RMI之介绍
http://zh.wikipedia.org/wiki/Java_RMI Java远程方法调用,即Java RMI(Java Remote Method Invocation)是Java编程语言里, ...
【转】Spring 4.x实现Restful web service
http://my.oschina.net/yuyidi/blog/352909 首先我们还是跟之前一样,创建一个maven项目,不过因为Spring Restful web service是基于Sp ...
C++ CheckListBox
实现过程 CCheckListBox listbox1; listbox1.AddString("葡萄"); listbox1.AddString(" ...
linux中shell变量$#,$@,$0,$1,$2的含义解释
linux中shell变量$#,$@,$0,$1,$2的含义解释 linux中shell变量$#,$@,$0,$1,$2的含义解释: 变量说明: $$ Shell本身的PID(ProcessID ...

html_table标签和from表单标签小试手

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

随机推荐

热门专题