设置样式：

<head>
<style type="text/css">
thead {color:green}
tbody {color:blue;height:50px}
tfoot {color:red}
</style>
</head>

<table border="1">

  <thead>

    <tr>

      <th>Month</th>

      <th>Savings</th>

    </tr>

  </thead>

  <tfoot>

    <tr>

      <td>Sum</td>

      <td>$180</td>

    </tr>

  </tfoot>

  <tbody>

    <tr>

      <td>January</td>

      <td>$100</td>

    </tr>

    <tr>

      <td>February</td>

      <td>$80</td>

    </tr>

  </tbody>

</table>

<tbody> 标签表格主体（正文）。该标签用于组合 HTML 表格的主体内容。

tbody 元素应该与 thead 和 tfoot 元素结合起来使用。

thead 元素用于对 HTML 表格中的表头内容进行分组，而 tfoot 元素用于对 HTML 表格中的表注（页脚）内容进行分组。

带有 thead、tbody 以及 tfoot 元素的 HTML 表格的更多相关文章

  1. HTML 表格<table><caption><th><tr><td><thead><tbody><tfoot><col><colgroup>

    <table>标签: 定义和用法: <table>标签定义HTML表格. 简单的HTML表格由table元素以及一个或多个tr.th或td元素组成. tr元素定义表格行,th元 ...

  2. css案例学习之用thead、tbody、tfoot实现漂亮的table布局

    首先说说thead.tbody.tfoot <thead> <tbody> <tfoot> 无论前后顺序如何改变, <thead> 内的元素总是在表的最 ...

  3. HTML表格,table,thead,tbody,tfoot,th,tr,td,的属性以及跨行，跨列

    在HTML中表格是作为一个整体来解析的,解析完才会在页面显示,如果表格很复杂很长,加载时间很长,用户体验就不好.所以这里就要用到表格结构标签,解析一部分就显示一部分,不用等表格全部加载完再显示. 表格 ...

  4. thead、tbody、tfoot与顺序无关

    今天发现一个问题,thead.tbody.tfoot等标签的内容排版与顺序无关,做了一个小的实验:

  5. table标签中thead、tbody、tfoot的作用

    为了让大表格(table)在下载的时候可以分段的显示,就是说在浏览器解析HTML时,table是作为一个整体解释的,使用tbody可以优化显示.如果表格很长,用tbody分段,可以一部分一部分地显示, ...

  6. Html标签中thead、tbody、tfoot的作用

    Html标签中thead.tbody.tfoot的作用 为了让大表格(table)在下载的时候可以分段的显示,就是说在浏览器解析HTML时,table是作为一个整体解释的,使用TBODY可以优化显示. ...

  7. table的thead,tbody,tfoot

    为了让大表格(table)在下载的时候可以分段的显示,就是说在浏览器解析HTML时,table是作为一个整体解释的,使用tbody可以优化显示. 如果表格很长,用tbody分段,可以一部分一部分地显示 ...

  8. html-3,table 表格标签 tr th td caption thead tbody tfoot 的简单使用

    <!-- table border='1' style="border-collapse:collapse;" border 表格的像素宽度 border-collapse: ...

  9. thead tbody tfoot

    <!DOCTYPE html> <html lang="en"> <head> <title>Title</title> ...

随机推荐

  1. DirectSound---输出设备基本操作（枚举、查询等）

    DirectSound是DirectX组件之一,提供了对音频设备的捕获和播放能力,同时它也是唯一几个支持Xp系统的音频技术之一. DirectSound主要有以下特点: 优点: 播放音频低延迟. 硬件 ...

  2. hive问题： For direct MetaStore DB connections, we don't support retries at the client level

    已经配置好hive,mysql作为元数据的数据库.在hive中执行drop语句出错: drop table mytest; 错误提示如下: FAILED: SemanticException Unab ...

  3. webp图像批量转换软件推荐——XnConvert

    XnConvert是一款简单易用的批量图像格式转换软件,其所支持图片格式有JPG.PNG.TIFF.GIF.RAW.JPEG2000.WebP.OpenEXR等等.你可以轻松的实现图像格式的转换.缩放 ...

  4. Android Studio | 详细安装教程

    Windows和Mac系统下的安装教程差不多,需要注意的是确保系统中已经安装了JDK,并且JDK版本为1.7或1.7以上版本,如果没有,请自行更新下载安装,地址如下: Java SE Develop ...

  5. jdbc+servlet+jsp实现登录验证

    基础知识准备:sql的增删改查. 新增:insert into 表名称(字段名.....)values(字段名....). 修改:update 表名称 set  字段名="新值" ...

  6. 一步一步创建ASP.NET MVC5程序[Repository+Autofac+Automapper+SqlSugar](二)

    前言: 在本系列第一篇<一步一步创建ASP.NET MVC5程序[Repository+Autofac+Automapper+SqlSugar](一)>中,我为大家介绍了搭建空白解决方案以 ...

  7. [Link-Cut-Tree]【学习笔记】

    可以按照<Utopiosphere>的调唱出来 “Link-Cut ,Time doesn’t stop .Prepare your doubts ,Eat them up” 参考资料: ...

  8. Sass和Compass入门

    一.前言 1.Sass是什么? Sass可以简化你的Css工作流,并可以使你的Css的扩展和维护工作变的更加容易!例如,曾几时何,因为客户的需求的变更,你必须不断的通过查找和替换来更改一个像素值,或者 ...

  9. Docker版本升级至17.03

    2017/3/3,Docker官方发表了一篇博客,Docker版本从1.13.*直接跳入17.03,该版本的意思是17年3月.同时,还声明了Docker以后会以CE(Community Edition ...

  10. 利用object.defineProperty实现数据与视图绑定

    如今比较火的mvvm框架,例如vue就是利用es5的defineProperty来实现数据与视图绑定的,下面我来介绍一下defineProperty的用法. var people= {} Object ...