在一个表格内嵌套另一个表格时，如何居中？

假设大表格为：

<table id="tableRow">

  <tr>

    <th>City</th>

    <th>Date</th>

    <th>Temperature</th>

    <th>Altitude</th>

    <th>Population</th>

    <th>Diner Rating</th>

  </tr>

  <tr>

    <td>Walla Walla, WA</td>

    <td class="center">June 15th</td>

    <td class="center">75</td>

    <td>1,204 ft</td>

    <td>29,686</td>

    <td class="center">4/5</td>

  </tr>

  <tr class="cellcolor">

    <td>Magic City, ID</td>

    <td class="center">June 25th</td>

    <td class="center">74</td>

    <td class="">5,312 ft</td>

    <td>50</td>

    <td class="center">3/5</td>

  </tr>

  <tr>

    <td>Bountiful, UT</td>

    <td class="center"> July 10th</td>

    <td class="center">91</td>

    <td>4,226 ft</td>

    <td>41,173</td>

    <td class="center">4/5</td>

  </tr>

  <tr class="cellcolor">

    <td>Last Chance, CO</td>

    <td class="center">July 23rd</td>

    <td class="center">102</td>

    <td>4,780 ft</td>

    <td>265</td>

    <td class="center">3/5</td>

  </tr>

  <tr>

    <td rowspan="2">Truth or Consequences, NM</td>

    <td class="center">August 9th</td>

    <td class="center">93</td>

    <td rowspan="2">4,242 ft</td>

    <td rowspan="2">7,289</td>

    <td class="center">5/5</td>

  </tr>

  <tr>

    <td class="center">August 27th</td>

    <td class="center">98</td>

    <td class="center">

      <table>

        <tr>

          <th>Tess</th>

          <td>5/5</td>

        </tr>

        <tr>

          <th>Tony</th>

          <td>4/5</td>

        </tr>

      </table>

    </td>

  </tr>

  <tr class="cellcolor">

    <td>Why, AZ</td>

    <td class="center">August 18th</td>

    <td class="center">104</td>

    <td>860 ft</td>

    <td>480</td>

    <td class="center">3/5</td>

  </tr>

</table>

小表格为：

      <table>

        <tr>

          <th>Tess</th>

          <td>5/5</td>

        </tr>

        <tr>

          <th>Tony</th>

          <td>4/5</td>

        </tr>

      </table>

使其居中的CSS为：

table table

{

  margin-left:      20px;

  margin-right:     20px;

}

效果：

综上，在一个表格内嵌套另一个表格时，居中的一种方法为设置小表格的外边距。

<HTML>在一个表格内嵌套另一个表格时，如何居中？的更多相关文章

  1. [Swift通天遁地]二、表格表单-(3)在表格中嵌套另一个表格并使Cell的高度自适应

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  2. 在C#中使用Panel控件实现在一个窗体中嵌套另一个窗体

    在C#中使用Panel控件实现在一个窗体中嵌套另一个窗体 在C#中使用Panel控件实现在一个窗体中嵌套另一个窗体ShowAllPage sAllPage = new ShowAllPage();   ...

  3. 利用jquery的$.Deferred方法在一个函数内获取另一个函数的返回值

    使用场景:方法B需要方法A执行完成之后再执行,比如方法B中有用到方法A的变量:(需要引入jQuery1.5以后的版本) function A(){ var deffered = new $.Defer ...

  4. For循环输出一个表格

    <!-- 作者:郑伟钊 时间:2017-01-16 描述:通过一个循环的嵌套输出一个表格 --> <?php header("Content-type:text/html; ...

  5. Python将多个excel表格合并为一个表格

    Python将多个excel表格合并为一个表格 生活中经常会碰到多个excel表格汇总成一个表格的情况,比如你发放了一份表格让班级所有同学填写,而你负责将大家的结果合并成一个.诸如此类的问题有很多.除 ...

  6. HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 03

    工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 其实,我还想使用表格,做一个这样的颜色表,如下图所示: 如果按照之前的做法,把每一种颜色都列 ...

  7. HTML & CSS & JavaScript 从一个表格到一个灰阶颜色表 02

    工具1:HBuilder X 1.9.9.20190522 工具2:火狐浏览器 67.0.4 (64 位) 其实,我想使用表格,做一个这样的颜色表,如下图所示: 例 3:我们参照上图,基于上一个例子, ...

  8. python爬虫（正则取数据）读取表格内的基金代码后爬取基金最新净值，同时写到对应的表格中，基于最近一次购买净值计算出涨跌幅（名字有点长）

    最近基金跌的真够猛,虽说是定投,但大幅度下跌,有时候适当的增加定投数也是降低平均成本的一种方式 每天去看去算太费时间,写了个爬虫,让他自动抓数据后自动计算出来吧 实现逻辑: 1.创建了一个excel表 ...

  9. 表格table嵌套，边框合并问题

    [问题] 外层table与内层table嵌套,内外表格都需边框时,设置“border=1”,但边框会重复,造成某些地方边框粗,有些地方边框细的问题.   [解决办法]: 外表格样式: <tabl ...

随机推荐

  1. 网页免费转换为可编辑的PDF

    Chrome自带的"打印"功能中,另存为PDF 可选择保存选中的内容.如果浏览器/网络出错,不能纠正.(推荐0) https://www.printfriendly.com (有C ...

  2. 3.MySQL的架构介绍

    MySQL简介: 高级MySQL:mysql 内核 sql优化工程师 mysql服务器的优化 各种参数常量设定 查询语句优化 主从复制 软硬件升级 容灾备份 sql编程 完整的mysql优化需要很深的 ...

  3. docker HealthCheck健康检查

    需求 最近遇到的问题:线上跑的一个 Node 镜像是在运行的,状态为 up ,但是访问报 502 ,重启镜像无效,重新拉了个镜像运行才恢复正常.于是想研究下如何从应用层面去检查容器的状态 为什么 do ...

  4. 8. Object References, Mutability, and Recycling

    1. Variables Are Not Boxes # Think variables as sticky notes a = [1, 2, 3] b = a a.append(4) print b ...

  5. LoadRunner（7）

    一.参数化策略 1.Select next row(How? 如何取?)取值方式 选择下一行 1)Sequential:顺序的 每个VU都从第一行开始,顺序依次向下取值: 数据取完可以从头循环重复使用 ...

  6. python+Appium自动化：元素等待时间

    元素等待时间 为什么要设置等待时间呢?主要是因为界面加载时,为了防止元素还未出现影响后续的操作. 主要有三种方式:强制(线性)等待.隐式等待.显式等待 适用于appium和selenium 强制(线性 ...

  7. visual studio 和visual studio code 的区别是什么？

    区别有三: 区别一:含义不一样. Visual Studio(简称VS)是美国微软公司的开发工具包系列产品,是一个基本完整的开发工具集,它包括了整个软件生命周期中所需要的大部分工具,如UML工具.代码 ...

  8. Unity 截图选择框，中间全透明，边缘半透明

    效果:点击白色框可拖拽选择区域 代码: using System.Collections; using System.Collections.Generic; using UnityEngine; u ...

  9. 洛谷-P3808-AC自动机(模板)

    链接: https://www.luogu.org/problem/P3808 题意: 给定n个模式串和1个文本串,求有多少个模式串在文本串里出现过. 思路: 模板, 代码: #include < ...

  10. 【AndroidStudio-添加RecyclerView包】 AndroidStudio添加v7包中的RecyclerView

    关于AndroidStudio如何添加v7包中的RecyclerView? 左侧Project视图,在External Libraries下找到appcompat-v7包 右击appcompat-v7 ...