最重要的三个

<table>     表格声明标签

属性:

  1. boarder    边框粗细
  2. style    可配合css 使用

<tr>    行标签 table row 有表就可以建行

<td>    单元格标签 table data     有行就可以建数据

属性:

  1. colspan    data占用格子, 或者可以理解为这个单元格要合并多少个横向的单元格.
  2. rowspan    纵向占用格子…

<th>    tablehead    单元格表头, 特殊类td, 由于表头的文字都会居中加粗, 是有一点不一样.

<!-- table 是表格声明标签, tr是一行, td是一格 -->

<table
border="1" style="width: 300px;">    

<!-- board 边框属性, 值越大越粗    style是配合css一起使用的, 设置行宽px是像素为单位. -->

    <tr>                                    

        <td>第一行,第一格</td>    

        <td>第一行,第二格</td>

        <td>第一行,第三格</td>

    </tr>

    <tr>

        <td>第2行,第一格</td>

        <td>第2行,第二格</td>

        <td>第2行,第三格</td>

    </tr>

    <br>

    

    <table
border="1" style="width: 300px;">    <!-- 复制的     -->

    <tr>

        <td>第一行,第一格</td>    

        <td>第一行,第二格</td>

        <td>第一行,第三格</td>

    </tr>

    <tr>

        <td>第2行,第一格</td>

        <td>第2行,第二格</td>

        <td>第2行,第三格</td>

    </tr>

    <tr>

        <td>只有一格</td>

    </tr>

    <tr>

        <td
colspan="3">只有一格,共占3格</td>

    

表的结构排序<thead><tbody><tfoot>

<tr>有多行, 有时候数据很多, 不一定能顾及前后, thead等的语义就是强制吧thead包括的内容全部调到第一展示. 而tfoot调到最后. 这是一个编程的规范

<table>

    <thead>

        <td>1</td>

    </thead>

    <tbody>

        <td>2</td>

    </tbody>

    <tfoot>

        <td>3</td>

    </tfoot>

</table>

 

<caption>    表的标题, 在框外.

background    通用属性, 用于颜色控制

注,此方法设置列的颜色行不通.

 

<colgrounp>

这个只能设置第一列是红色, 不能设置指定列的颜色.

如果是<colgroup style="background:red;"span =2> <colgroup>        span=2 只能是前两列而不是第二列

两种正确的方法

1.先设置第一列的颜色,在设置第二列颜色


2.使用col占位符

html5 表格标签 table tr td的更多相关文章

  1. HTML中表格元素TABLE,TR,TD及属性的语法

    table:表格元素及属性 <table width="80%" border="1" cellspacing="1" cellpad ...

  2. html5常用标签table表格布局

    html5常用标签table表格布局 一.总结 一句话总结: 二.html5常用标签table表格布局 用表格显示信息调理清楚,使浏览者一目了然.表格在网页中还有协助布局的作用,可以把文字.图像等组织 ...

  3. HTML+css基础 表格标签table Table标签属性 td标签属性

    表格标签table:   他是由行与列构成,最小单位是单元格. 行标签  <tr></tr> 单元格标签<td></td> Table标签属性: Bor ...

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

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

  5. 前端 HTML body标签相关内容 常用标签 表格标签 table

    表格标签 table 表格由<table> 标签来定义.每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由<td>标签定义).字母 td 指表 ...

  6. html表格中的tr td th用法

      表格是html中经常使用到的,简单的使用可能很多人都没问题,但是更深入的了解的人恐怕不多,下面我们先来看一下如何使用. <table>是<tr>的上层标签 <tr&g ...

  7. 关于html与css的标签及属性(text文本属性、背景background属性、表格标签table、列表、)

    text文本属性1.颜色 colorcolor:red: 2.文本缩进text-indant属性值 num+px text-indant:10px:3.文本修饰 text-decoration属性值: ...

  8. html中table,tr,td

    table表格,tr表格中的行,tr表格中的列,等级关系是table>tr>td, 当然表格中还包括thead,tbody,tfoot,th,但由于浏览器支持缘故很少使用.另外table在 ...

  9. jQuery操作Table tr td常用的方法

    虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...

随机推荐

  1. css常用属性总结之 id和class的区别,使用类还是ID?

    前面两篇文章我们分别谈到了class和id的相关知识和如何使用,但是在实际项目中,我们该如何抉择,class还是id? 先回顾下两者的区别吧! 1.id具有唯一性,class具有普遍性,所以一个页面同 ...

  2. iOS 导航栏黑线,UIImage 枚举处理方式

      ios 找出导航栏下面的黑线(可隐藏,改变样式等) http://www.jianshu.com/p/effa4a48f1e3     设置UIImage的渲染模式:UIImage.renderi ...

  3. c++ 命令模式(command)

    命令模式的有点: 1.能够容易地设计一个命令队列: 2.在需要的情况下,可以比较容易地将命令记入日志. 3.可以容易的实现对请求的撤销和重做. 4.由于加进新的具体命令类不影响其他的类,因此增加新的具 ...

  4. Centos7 安装Nginx服务

    第一种方式:通过yum安装 直接通过 yum install nginx 肯定是不行的,因为yum没有nginx,所以首先把 nginx 的源加入 yum 中. 运行下面的命令: 1.将nginx放到 ...

  5. VIO系统的IMU与相机时间偏差标定

      视觉里程计(VIO)作为一种空间定位方法,广泛应用于VR/AR.无人驾驶和移动机器人,比如近年火热的苹果 AR-Kit和谷歌AR-Core都使用了VIO技术进行空间定位.通常,VIO系统忽略IMU ...

  6. EntityFramework 学习资料

    1.EF框架step by step 2.Entity Framework Code First 学习日记 3.[译著]Code First :使用Entity. Framework编程 4.Enti ...

  7. loadrunner12-错误 -26366: 找不到 web_reg_find 的“Text=19728.00”

    转:检查点(web_reg_find函数详解) LR检查点 设置检查点的目的不只是为了验证我们的脚本没有错误,而更重要的是一个规范问题,如何使得测试结果更具有说服力,因此建议所有的测试脚本中都添加检查 ...

  8. Ubuntu16.0安装Eclipse Neon

    eclipse在Ubuntu下安装先安装jdk,配置环境变量,之后下载eclipse安装包,解压,放置在目标目录,将jre链接到该目录或者将jdk下的jre目录复制到eclipse安装包目录下,双击文 ...

  9. [Cookie] Read Cookie and Pass in headers

    在同一个Suite里 import com.eviware.soapui.support.types.StringToStringMap def headers = testRunner.testCa ...

  10. Spring.net 事件的注入

    1.首先上客户端代码 static void Main(string[] args)        {            IApplicationContext ctx = ContextRegi ...