HTML表格

表格由<table>标签来定义，表格的行由<tr>标签来定义，表格的列由<td>标签来定义

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>表格</title>

</head>

<body>

<table border="">

    <tr>

        <td>第一行第一列</td>

        <td>第一行第二列</td>

    </tr>

    <tr>

        <td>第二行第一列</td>

        <td>第二行第二列</td>

    </tr>

</table>

</body>

</html>

border=1是设置边框的粗细，不需要边框，可以去掉

使用<th>标签定义表头，大部分浏览器会把表头加粗居中显示

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>表格</title>

</head>

<body>

<table border="">

    <tr>

        <th>表头1</th>

        <th>表头2</th>

    </tr>

    <tr>

        <td>第一行第一列</td>

        <td>第一行第二列</td>

    </tr>

    <tr>

        <td>第二行第一列</td>

        <td>第二行第二列</td>

    </tr>

</table>

</body>

</html>

跨格表格使用colspan属性

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>表格</title>

</head>

<body>

<table border="">

    <tr>

        <th colspan="">单元格跨两格</th>

    </tr>

    <tr>

        <td>第一行第一列</td>

        <td>第一行第二列</td>

    </tr>

    <tr>

        <td>第二行第一列</td>

        <td>第二行第二列</td>

    </tr>

</table>

</body>

</html>

跨列表格使用rowspan属性

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>表格</title>

</head>

<body>

<table border="">

    <tr>

        <th>表头1</th>

        <th>表头2</th>

    </tr>

    <tr>

        <td rowspan="">单元格跨两列</td>

        <td>第一行第二列</td>

    </tr>

    <tr>

        <td>第二行第二列</td>

    </tr>

</table>

</body>

</html>

HTML学习笔记08-表格的更多相关文章

  1. 机器学习实战（Machine Learning in Action）学习笔记————08.使用FPgrowth算法来高效发现频繁项集

    机器学习实战(Machine Learning in Action)学习笔记————08.使用FPgrowth算法来高效发现频繁项集 关键字:FPgrowth.频繁项集.条件FP树.非监督学习作者:米 ...

  2. C++ GUI Qt4学习笔记08

    C++ GUI Qt4学习笔记08   qtc++signal图形引擎文档 本章介绍Qt的二维图形引擎,Qt的二维图形引擎是基于QPainter类的.<span style="colo ...

  3. HTML5学习笔记之表格标签

    HTML5学习笔记之表格标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之基础标签 HTML5学习笔记之表格标签 HTML5学习笔记之表单标签 HTML5学习笔 ...

  4. CSS学习笔记08 浮动

    从CSS学习笔记05 display属性一文中,我们知道div是块元素,会独占一行,即使div的宽度很小,像下面这样 应用display属性的inline属性可以让div与div共享一行,除了这种方法 ...

  5. [Golang学习笔记] 08 链表

    链表(Linked list)是一种常见数据结构,但并不会按线性的顺序存储数据,而是在每一个节点里存到下一个节点的指针. 由于不必须按顺序存储,链表在插入的时候可以达到O(1),比顺序表快得多,但是查 ...

  6. [原创]java WEB学习笔记08：HttpServletRequest & ServletRequest

    本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...

  7. Bash脚本编程学习笔记08：函数

    官方资料:Shell Functions (Bash Reference Manual) 简介 正如我们在<Bash脚本编程学习笔记06:条件结构体>中最后所说的,我们应该把一些可能反复执 ...

  8. HTML 学习笔记 CSS(表格)

    CSS 表格属性可以帮助您极大的改善表格的外观 表格边框 如需在CSS中设置表格的边框 请使用border属性. 在下面的例子中table th 以及td设置了蓝色边框. table, th, td ...

  9. 3.4html学习笔记之表格

    <table border=""style="border-collapse:collapse"> <caption>表格</ca ...

  10. html+css学习笔记 5[表格、表单]

    表格 -- 默认样式重置 表格标签:     table 表格     thead 表格头     tbody 表格主体     tfoot 表格尾     tr 表格行     th 元素定义表头 ...

随机推荐

  1. [CF791D]Bear and Tree Jumps

    题目描述 A tree is an undirected connected graph without cycles. The distance between two vertices is th ...

  2. [luogu3979][bzoj3083]遥远的国度

    [luogu传送门] [bzoj传送门] 题目描述 zcwwzdjn在追杀十分sb的zhx,而zhx逃入了一个遥远的国度.当zcwwzdjn准备进入遥远的国度继续追杀时,守护神RapiD阻拦了zcww ...

  3. luogu1979 华容道 (dijkstra+bfs)

    我想动某个点的话,一定要先把空白点移动到这个点旁边,然后调换这个点和空白点,一直重复 那么,我们就可以记一些状态(x,y,s) (s={0,1},{0,-1},{1,0},{-1,0}),表示我要动的 ...

  4. Luogu 1941 【NOIP2014】飞扬的小鸟 （动态规划）

    Luogu 1941 [NOIP2014]飞扬的小鸟 (动态规划) Description Flappy Bird 是一款风靡一时的休闲手机游戏.玩家需要不断控制点击手机屏幕的频率来调节小鸟的飞行高度 ...

  5. P1856 矩形周长

    哇!这小破题坑了我好久. 扫描线+线段树 这题数据范围小,没离散化.真要离散化我还搞不好呢. 具体的看这个博客吧. 主要是这个坑爹的c,len把我搞了,其他的还好. 代码: #include < ...

  6. 硬盘读取速度变慢 — 当前传送模式: PIO模式

    网上搜索了一下,找到两篇文章: 标题:硬盘读取速度变慢 当前传输模式pio的解决方法 http://www.veryhuo.com/a/view/52786.html   (解决思路:先卸载驱动,重启 ...

  7. 外显子分析弹错解决方案：Invalid command line: Cannot process the provided BAM/CRAM file(s) because they were not indexed.

    出现这种问题说明bam/cram文件没有进行index. Samtool能解决这个问题,以bam文件为例,输入以下命令行即可解决问题: /path/to/your/samtools index fil ...

  8. Eclipse集成Gradle 【Eclipse在线安装Gradle插件方法】

    本章将介绍了Eclipse集成Gradle.以下是将Gradle插件添加到Eclipse的步骤. 步骤1 - 打开Eclipse Marketplace 打开在系统中安装好的Eclipse. 转到 J ...

  9. 获取CPU序列号、网卡MAC地址、硬盘序列号

    <pre name="code" class="csharp"> using System; using System.Collections; u ...

  10. 泛型List小项目

    页面设计: 显示图书列表运行效果: 添加集合元素运行效果: 插入集合元素运行效果: 删除选中对象: 项目我已经上传到我的百度云盘,下载链接:http://pan.baidu.com/s/1mi3BjY ...