• <table> 标签

    • 表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。　

      • border 属性：规定表格单元拥有边框　　　
  • <tr> 表格行标签　　
    • 用来定义表格的一行。由于HTML表格是面向行的，所以必须分别表示每一行　　
    • tr 元素可以在 table，thead，tbody 和 tfoot 元素内使用　　
    • tr 元素内可以包含一个或者多个 td 或 th 元素　　
  • <td> 表格单元格标签
    • 用来定义表格单元格，可以同 colspan，rowspan，headers 局部属性使用

      • colspan： 左右合并单元格，该属性规定了单元格可横跨的列数，该属性的值必须是整数　　
      • rowspan：上下合并单元格，该属性规定了单元格可横跨的行数，该属性的值必须是整数　　
      • cellpadding：规定单元格边沿与其内容之间的空白
        • cellpadding="0"  是让单元格边框线与单元格中的内容之间的距离为0像素，即单元格中内容紧挨着单元格的边线。
      • cellspacing：规定单元格之间的空白
        • cellspacing="0"  是让各单元格之间的缝隙为0象素
      • headers：该属性的值是一个或多个单元的 ID 属性值，将单元格与列标题相关联，可用于使用屏幕阅读器　　
      • width：规定表格宽度
      • height：规定表格高度
      • align：规定表格相对周围元素的对齐方式
        • left
        • center
        • right
  • <th> 标题单元格标签
    • 用来定义标题单元格，使我们有效区分数据及其描述　　
    • 它同 <td> 元素具有相同的局部属性，两者有如下区别：　　
      • <th> 是表示头标记，通常位于首行或者首列。而且 <th> 中的文字默认会被加粗，而 <td> 是不会的　　　　
      • <td> 是数据标记，表示单元格的具体的数据　
  • 快速制表
    • 如下快速生成 3 行 2 列的方法
  1.     <body>
  2.         table>tr*3>td*2      <!-- 输入完后，再按 Tab 键 -->
  3.     </body>
  1.     <body>
  2.         <table border="1">
  3.             <tr>
  4.                 <th>姓名</th>
  5.                 <th>年纪</th>
  6.                 <th>班级</th>
  7.             </tr>
  8.             <tr>
  9.                 <td>张三</td>
  10.                 <td>18</td>
  11.                 <td>一班</td>
  12.             </tr>
  13.         </table>
  14.     </body>
  1.     <body>
  2.         <table border="1" width="200" height="20">
  3.             <tr>
  4.                 <th>姓名</th>
  5.                 <th>年纪</th>
  6.                 <th>班级</th>
  7.             </tr>
  8.             <tr align="center">
  9.                 <td>张三</td>
  10.                 <td>18</td>
  11.                 <td>一班</td>
  12.             </tr>
  13.         </table>
  14.     </body>
  1.     <body>
  2.         <table border="1" width="200" height="20">
  3.             <tr>
  4.                 <th>姓名</th>
  5.                 <th>年纪</th>
  6.                 <th>班级</th>
  7.             </tr>
  8.             <tr>
  9.                 <td>张三</td>
  10.                 <td></td>
  11.                 <td rowspan="2"></td>    <!-- 上下合并 -->
  12.             </tr>
  13.             <tr>
  14.                 <td>李四</td>
  15.                 <td></td>
  16.                 <!-- <td></td> -->
  17.             </tr>
  18.             <tr>
  19.                 <td>王五</td>
  20.                 <td colspan="2"></td>    <!-- 左右合并 -->
  21.                 <!-- <td></td> -->
  22.             </tr>
  23.         </table>
  24.     </body>

HTML（表格标签）的更多相关文章

  1. H5 表格标签的其它标签

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  2. H5 表格标签基本使用

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  3. HTML常用标签与表格标签

    超链接标签: <a href="超链接地址" target="_blank">超链接的文字</a> _blank或new是在新网页中打开 ...

  4. 9月6日表格标签（table、行、列、表头）（补）

    一.<table> <table>代表表格标签.   <table></table> 1.width  表示表格宽度,宽度表达方式有像素和百分比两种.网 ...

  5. PHP入门 - - 06-->HTML的表格标签

    表格标签<table> <table>的属性: Align: left, center, right          (表格的)位置 Border:              ...

  6. 透明、圆角、阴影效果、背景色渐变、<a></a>去外层虚线、！！！表格标签<table>

    表格标签 <table> 代表表格 width:指表格的宽度           一种是像素 (浏览器缩小的时候出现滚动条)           一种是百分比(跟着浏览器的大小而大小) b ...

  7. HTML的表格标签

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. HTML表格标签

    table标签的用途: 在表格中放图片,或用于布局(已经淘汰掉了),存放数据 table制作过程: 1.先分析表格有多少行 2.分析有多少列 3.做好表格的基本之后再添加表格需要的一些属性 table ...

  9. html系列教程--span style 及表格标签 title video

    <span> 标签:非块状元素,用于文本描述 <style> 标签:内联样式表标签定义样式信息,必须写明type类型为text/css,建议写在head中,不是必须 demo: ...

  10. HTML表格标签的使用-&lt;table&gt;

    <html> <head> <title> 表格标签 </title> <!-- 标签名:table 定义一个表格 子标签:<caption ...

随机推荐

  1. 曹工说Redis源码（5）-- redis server 启动过程解析，以及EventLoop每次处理事件前的前置工作解析（下）

    曹工说Redis源码(5)-- redis server 启动过程解析,eventLoop处理事件前的准备工作(下) 文章导航 Redis源码系列的初衷,是帮助我们更好地理解Redis,更懂Redis ...

  2. spark模型error java.lang.IllegalArgumentException: Row length is 0

    failure: Lost task 18.3 in stage 17.0 (TID 59784,XXXXX, executor 19): java.lang.IllegalArgumentExcep ...

  3. C# 基础知识系列- 9 字符串的更多用法（二）

    0. 前言 上一篇文章介绍了字符串自身的一些方法,就是对象方法.在字符串体系中,还有一些是string类提供的静态方法.这两部分构成了字符串体系,当然还有一些三方库为字符串提供了扩展方法. 这里简单的 ...

  4. 一个不错的intellj 相关的博客

    http://my.oschina.net/lujianing/blog?catalog=3300430

  5. ftl中几个特殊的用法

    @ 注意${}为变量的渲染显示,即先计算后打印出来,而<>里面为定义等操作符的定义 ,而首尾2个<>中间部分一般为计算打印部分 @数据模型中如果不是以map数据来封装的,而是直 ...

  6. Spring Cloud和eureka启动报错 解决版本依赖关系

    导读 An attempt was made to call a method that does not exist. The attempt was made from the following ...

  7. Three.js如何选中外部模型

    1.问题 three.js中模型选中使用的是射线法,根据摄像机角度,鼠标点击位置和模型选中的distance参数判断来选中模型.对于原生的矢量模型完全没有问题,但是当遇到导入的外部模型,如obj.st ...

  8. Git应用详解第十讲：Git子库：submodule与subtree.md

    前言 前情提要:Git应用详解第九讲:Git cherry-pick与Git rebase 一个中大型项目往往会依赖几个模块,git提供了子库的概念.可以将这些子模块存放在不同的仓库中,通过submo ...

  9. 本地同时使用多个git账号

    config文件说明 Git Document指示在首次安装git的时候需要配置Config的相关内容信息,有三个地方存储了config文件,决定了读取的场景不同. 1 /etc/gitconfig: ...

  10. Python 如何移除旧的版本特性，如何迎接新的特性？

    2020 年 4 月 20 日,Python 2 的最后一个版本 2.7.18 发布了,这意味着 Python 2 是真正的 EOL(end of life)了,一个时代终于落幕了. Python 2 ...