<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>表格与表单02</title>

        <style>

            table{

                width: 1000px;

                border: 1px white solid;

                margin: 100px auto;

                border-collapse: collapse;

            }

            td,th{

                border: 1px white solid;

                padding: 20px;

            }

            .a{background-color:paleturquoise ;}

            first td{background-color: cadetblue;}

            .b{background-color: darkgoldenrod;}

        </style>

    </head>

    <body>

        <table>

            <tr style="background-color: darkcyan;">

                <th rowspan="2">Main mode</th>

                <th colspan="5">Area of workspace</th>

            </tr>

            <tr style="background-color: cadetblue;">

                <td> Central London</td>

                <td> Rest of inner London</td>

                <td> Outer London</td>

                <td> all London</td>

            </tr>

            <tr>

                <td style="background-color: cadetblue;"> Car and van</td>

                <td class="a">48</td>

                <td class="a">56</td>

                <td class="a">24</td>

                <td class="a">18</td>

            </tr>

            <tr>

                <td style="background-color: cadetblue;"> Motorbike</td>

                <td class="a">25</td>

                <td class="a">34</td>

                <td class="a">27</td>

                <td class="a">41</td>

            </tr>

            <tr>

                <td style="background-color: cadetblue;"> Bicycle</td>

                <td class="a">45</td>

                <td class="a">27</td>

                <td class="a">58</td>

                <td class="a">14</td>

            </tr>

                <tr>

                <td style="background-color: cadetblue;"> Bus and coach</td>

                <td class="a">47</td>

                <td class="a">56</td>

                <td class="a">25</td>

                <td class="a">14</td>

            </tr>

                <tr>

                <td style="background-color: cadetblue;"> National Rall</td>

                <td class="a">19</td>

                <td class="a">34</td>

                <td class="a">28</td>

                <td class="a">27</td>

            </tr>

                <tr>

                <td style="background-color: cadetblue;">Underground,train, light,rall</td>

                <td class="a">45</td>

                <td class="a">35</td>

                <td class="a">67</td>

                <td class="a">58</td>

            </tr>

                <tr class="b">

                <td> Total</td>

                <td> 150</td>

                <td> 123</td>

                <td> 142</td>

                <td> 181</td>

            </tr>

        </table>

</html>

结果：

Html学习之十八（表格与表单学习--统计表制作）的更多相关文章

  1. Html学习之十七（表格与表单学习--排行版制作）

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. 测开之路一百四十八：WTForms表单验证

    使用WTForms表单验证,可以在数据建模时就设置验证信息和错误提示 创建模型时,设置验证内容,如必填.格式.长度 from flask_wtf import Formfrom wtforms imp ...

  3. Html学习之十九（表格与表单学习--邮箱注册页面设计）

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. Html学习之十六（表格与表单学习--课程表制作）

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. python3.4学习笔记(十八) pycharm 安装使用、注册码、显示行号和字体大小等常用设置

    python3.4学习笔记(十八) pycharm 安装使用.注册码.显示行号和字体大小等常用设置Download JetBrains Python IDE :: PyCharmhttp://www. ...

  6. 学习笔记：CentOS7学习之十八：Linux系统启动原理及故障排除

    目录 学习笔记:CentOS7学习之十八:Linux系统启动原理及故障排除 18.1 centos6系统启动过程及相关配置文件 18.1.1 centos6系统启动过程 18.1.2 centos6启 ...

  7. DOM之表格与表单基础分享

    我是沐晴,好久不见.马上要放假啦,也是比较的忙. 今天来谈谈表格和表单的基本知识.前期的写的都是比较基础的知识,后期会慢慢增加实例.一起来学习吧. 先看表格,DOM中提供了一些属性,便于我们获取表单节 ...

  8. WEB入门二 表格和表单

    学习内容 Ø        表格的作用和制作 Ø        表单的制作 能力目标 Ø        掌握表格的创建 Ø        掌握设置表格的常用属性: Ø        理解表单的作用 Ø ...

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

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

随机推荐

  1. Fiddler应用——使用Fiddler修改指定request/response报文

    Fiddler是一个http协议调试代理工具,它能够记录并检查所有你的电脑和互联网之间的http通讯,分析数据,设置断点,修改请求/响应数据,查看所有的“进出”Fiddler的数据(指cookie,h ...

  2. poj 3069 Saruman's Army 贪心 题解《挑战程序设计竞赛》

    地址 http://poj.org/problem?id=3069 题解 题目可以考虑贪心 尽可能的根据题意选择靠右边的点 注意 开始无标记点 寻找左侧第一个没覆盖的点 再来推算既可能靠右的标记点为一 ...

  3. nginx学习(三)：nginx的进程模型

    概述 nginx 进程分为 master进程和work进程 1.打开配置文件查看,这里我修改为2 [root@xxx conf]# vim nginx.conf #user nobody; worke ...

  4. Tomcat中session复制技术

    一.准备三台机器主机的服务都正常,nginx与Tomcat构建负载均衡 主机名     IP地址 nginx       192.168.200.111 Tomcat1  192.168.200.11 ...

  5. [译]ABP v1.0终于发布了!

    ABP v1.0终于发布了! 今天是个大日子!经过约3年的不断开发,第一个稳定的ABP版本,1.0,已经发布了.感谢为该项目做出贡献或试用过的每个人. 立即开始使用新的ABP框架:abp.io/get ...

  6. RMAN详细教程(三)：备份脚本的组件和注释

    RMAN详细教程(一):基本命令代码 RMAN详细教程(二):备份.检查.维护.恢复 RMAN详细教程(三):备份脚本的组件和注释 RMAN详细教程(四):备份脚本实战操作 一.基本组件: 1.Ser ...

  7. 避免Java中NullPointerException的Java技巧和最佳实践

    Java中的NullPointerException是我们最经常遇到的异常了,那我们到底应该如何在编写代码是防患于未然呢.下面我们就从几个方面来入手,解决这个棘手的​问题吧.​ 值得庆幸的是,通过应用 ...

  8. 使用suds模块进行封装，处理webservice类型的接口

    import json from suds.client import Client class HandleWebservice: ''' 定义一个webservice类型的接口处理类 ''' de ...

  9. 使用pytorch时所遇到的问题总结

    使用pytorch时所遇到的问题总结 1.ubuntu vscode切换虚拟环境 在ubuntu系统上,配置工作区文件夹所使用的虚拟环境.之前笔者误以为只需要在vscode内置的终端上将虚拟环境切换过 ...

  10. Nginx反向代理Tomcat静态资源无法加载以及请求链接错误

     在使用Nginx实现Tomcat的负载均衡的时候,项目发布到了Tomcat,Nginx也配置好了, 当访问的时候发现了与预期不符 表现为: 静态资源加载失败 链接跳转地址错误 下面是我错误的配置文件 ...