<!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. CentOS 7 配置SVN 笔记

    一.通过yum 安装软件 yum install subversion -y 配置nfs 用来做版本库(略过) 格式 : NFS共享的目录 NFS客户端地址1(参数1,参数2,...) 客户端地址2( ...

  2. 求n的阶乘!

    编写一个computer类,类中含有一个求n的阶乘的方法,将该类打包, 在另一个包中引入包,在主类中定义computer类的对象,调用求n的阶乘的方法,并输出结果 结果

  3. xpath:

    from selenium import webdriverb = webdriver.Firefox()#路径读取方式一:# b.get(r"C:\我的代码\selenium自动化测试\t ...

  4. 微服务、SpringCloud、k8s、Istio杂谈

    一.微服务与SOA “微服务”是一个名词,没有这个名词之前也有“微服务”,一个朗朗上口的名词能让大家产生一个认知共识,这对推动一个事务的发展挺重要的,不然你叫微服务他叫小服务的大家很难集中到一个点上. ...

  5. python解释器和环境安装

    现在最新的是python3.7下载好安装包:python-3.7.0-amd64.exe下载地址:https://www.python.org/getit/ 选择3.7.0下载 选择一款适合自己的编译 ...

  6. Mybatis框架模糊查询+多条件查询

    一.ISmbmsUserDao层 //根据姓名模糊查询 public List<Smbms> getUser(); //多条件查询 public List<Smbms> get ...

  7. 使用csv模块读写csv格式文件

    import csv class HandleCsv: ''' csv文件处理类 ''' def __init__(self, filename): ''' 构造器 :param filename: ...

  8. vue组件定义方式,vue父子组件间的传值

    vue组件定义方式,vue父子组件间的传值 <!DOCTYPE html> <html lang="zh-cn"> <head> <met ...

  9. 【mysql】You must reset your password using ALTER USER statement before executing this statement. 报错处理

    1.问题:登陆mysql以后,不管运行任何命令,总是提示这个 mysql> select user,authentication from mysql.user; ERROR 1820 (HY0 ...

  10. C# - WinFrm应用程序MessageBox自动关闭小实验

    概述 在程序中MessageBox弹出的对话框,用于向用户展示消息,这是一个模式窗口,可阻止应用程序中的其他操作,直到用户将其关闭.但是有时候在自动化程序中,如果弹出对话框,程序将会中断,等待人工的干 ...