<!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. iperf 一个测试网络吞吐的工具

    在分布式文件系统开发和测试过程中,我们经常需要测试真实的网络带宽,来进行估测分布式系统的传输性能,所以我们要对现有的网络进行测试:Iperf 是一个网络性能测试工具.IPerf可以测试最大的TCP和U ...

  2. private构造器和单例模式

    // hiding/Lunch.java // Demonstrates class access specifiers. Make a class // effectively private wi ...

  3. python第二次作业-titanic数据库练习

    一.读入titanic.xlsx文件,按照教材示例步骤,完成数据清洗. titanic数据集包含11个特征,分别是: Survived:0代表死亡,1代表存活Pclass:乘客所持票类,有三种值(1, ...

  4. Matlab2019a启动慢，寻找许可证耽误时间解决办法

    Matlab2017b启动慢,一直处于初始化状态的解决办法 - 善水的博客 - CSDN博客 评论区给出了更为具体的做法,效果非常好. "D:\Program Files\MATLAB\R2 ...

  5. Oracle - v$lock查询慢原因分析

    数据库内部对象X$统计信息过旧,导致v$lock查询慢 前段时间用python写了个zabbix监控脚本,里面有一个检查锁的sql语句,sql语句是这样子的select count(*) retval ...

  6. [IDA]修改变量类型、删除变量名

    1. 双击变量 2. 按D转换类型(Word.Byte.Dword) 3. 按U删除变量名 4. 按N修改变量名

  7. Java开发桌面程序学习（七）——ImageView设置图片以及jar包读取fxml文件

    ImageView设置图片 JavaFx的ImageView,设置图片不能直接通过属性设置,只能通过代码来设置 ImageView设置图片 首先,我们让fxml对应的那个controller的java ...

  8. .NET Core CSharp初级篇 1-2 循环与判断

    .NET Core CSharp初级篇 1-2 本节内容循环与判断 循环 循环是一个在任何语言都是极为重要的语法,它可以用于很多东西,例如迭代数组等等.在C#中,语法层面的循环有:for , fore ...

  9. kafka的主题与消费

    同一个消费者组不能同时消费同一个分区的数据 不同分区可以消费同一组不同消费者 同一个消费者可以同时消费多个topicA的数据 Topic和consumer依赖zookeeper,producer不依赖

  10. Web前端基础(6):CSS(三)

    1. 定位 定位有三种:相对定位.绝对定位.固定定位 1.1 相对定位 现象和使用: 1.如果对当前元素仅仅设置了相对定位,那么与标准流的盒子什么区别. 2.设置相对定位之后,我们才可以使用四个方向的 ...