语法与语义:
  <table>和</table>定义表格的开始和结束
  <thead>和</thead>定义表格头部的开始和结束
  <tbody>和</tbody>定义表格主体开始和结束
  <tfoot>和</tfoot>定义表格脚注的开始和结束
  <tr>和</tr>定义表行的开始和结束
  <td>和</td>定义表列(单元格)的开始和结束
  <th></th>定义标题栏,和<td>级别相同(文字加粗、居中)。
1.table的属性集
属性 作用
bgcolor 设置表格背景色
background 设置表格背景图片
border 设置边框宽度,默认为0
cellpadding 设置单元格与内容之间的距离,默认值为2
cellspacing 设置单元格之间的距离,默认值为2
bodercolor 设置边框颜色
bodercolorlight 置边框亮部分的颜色(boder大于等于1时有效)
bodercolordark 设置边框暗部分的颜色(boder大于等于1时才有效)
align 设置表格对齐格式(left、center、right)
width 设置表格宽度,单位用绝对像素和百分比
height 设置表格高度,单位用绝对像素和百分比
2.tr的属性集
属性 作用
width 设置行宽度
height 设置行高度
bgcolor 设置行的背景颜色
align 设置水平对齐方式(left/right/center)
valign 设置行垂直对齐方式(top、middle、bottom)
3.td的属性集
属性 作用
width 设置单元格宽度
height 设置单元格高度
bgcolor 设置单元格的背景颜色
background background
align 设置水平对齐方式(left/right/center)
valign 设置行垂直对齐方式(top、middle、bottom)
rowspan 设置行合并数目
colspan 设置列合并数目
nowarp 设置在单元格中不换行

4.立体表格实现原理

表格的亮边框和暗边框颜色进行对比。

5.细线表格效果的实现原理

1.将表格的boder设为0.

2.给表格设置背景颜色为细线颜色

3.給表格设置单元格背景为白色

4.給表格设置单元格之间的距离为细线宽度

6.table的边框设置及其效果

属性名称 属性值 说明

frame(border>0)

void 不显现表格的边线
above 只显现表格上边线
below 只显现表格下边线
hsides 只显现表格上下边线
vsides 只显现表格左右边线
lhs 只显现表格的左边线
vhs 只显现表格的右边线
border/box 显现表格的所有边线
rules     rows 只显示横行的格框线
cols 只显示直行的格框线
all 显示所有的格框线
groups 表示列组合水平部分
none 不显示任何格框线

7.表格结构化格式

  <table>

    <thead>表头区</thead>

    <tbody>表体区</tbody>

    <tfoot>表尾区</tfoot>

  </table>

8.直列化格式:<colgroup><colgroup>(<col>与<colgroup>的功能完全一样)

属性名称

属性值

说明

align

left

靠左

center

靠中

right

靠右

valign

top

靠上

middle

靠中

bottom

靠下

span

数字

直列数

bgcolor

颜色

背景颜色

  

  例如:想把一个表格的第n列的颜色改变,可以这样做:

    <colgroup span=”n-1”></colgroup>

    <colgroup bgcolor=”你想的颜色”></colgroup>

9.表格的标题:

  <table>

    <caption>标题名</caption>

  </table>

属性名称

属性值

说明

align

top

标题在表格上方

bottom

标题在表格下方

left

标题在表格左方

right

标题在表格右方

HTML标记语法之表格元素的更多相关文章

  1. HTML标记语法之列表元素

    1.无序列表 <ul> <li type=”项目符号类型”></li> <li type=”项目符号类型”></li> <li typ ...

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

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

  3. HTML(二):表格元素

    表格元素的作用:用来格式化显示数据. 一.表格的基本结构 表格的基本语法:<TABLE border="设置表格边框尺寸大小" width="" cell ...

  4. HTML标记语法总结

    一.HTML标记类型 1.单标记 语法:<标记名>,如:<img>.<br>.<hr> 2.双标记 语法:<标记名>…标记内容…</标 ...

  5. html中表格元素的相关总结

    表格元素相关总结: 1.在CSS中,内部表元素(如td.tr.col等)生成矩形框,这些矩形框包含内容.内边距和边框,但没有外边距,因此如果定义外边距,浏览器将忽略该定义:对于table元素,外边距有 ...

  6. WPF的"路径标记语法"

    在此之前我们先了解一下WPF的"路径标记语法" M:表示绘制起点 // M 0,0 L:表示绘制直线 (H:横线 V:竖线)  // L 100,0 C:三次方贝塞尔曲线   // ...

  7. dtd语法之定义元素

    1.语法:<!ELEMENT 元素名 使用规则> 使用规则: l (#PCDATA) :表示内容为普通文本数据 l EMPTY :表示元素内容必须为空 l ANY :元素出现任意次,一般用 ...

  8. 详解WPF Blend工具中的复合路径功能 ( 含路径标记语法 )

    写此文章的目的是为了简单分析一下 Blend工具中提供的"复合路径"功能.有人在我的博文中留言问我复合路径的问题.  稍微琢磨一下,觉得应该是对的.因此贴出来和大家分享.有不对的说 ...

  9. 【转】关于 Endnote 与 Word 卡死问题 标记语法错误

    转自:http://hi.baidu.com/lvneng/item/8147dcbb1436bfd085dd7962 当使用 Word 写论文或稿件时,Endnote 绝对是一个不错的帮手,不过偶尔 ...

随机推荐

  1. Java项目相关监控与调优

    Linux  JVM Tomcat =========Linux =============== 监控 nmon  命令:nmon -s 10 -c 60 -f -m /home -s 10 每10s ...

  2. javascript高级程序设计---Element对象

    Element对象对应网页的HTML标签元素.每一个HTML标签元素,在DOM树上都会转化成一个Element节点对象(以下简称元素节点).元素节点的nodeType属性都是1,但是不同HTML标签生 ...

  3. CSS3必须要知道的10个顶级命令

    1.边框圆角(Border Radiuas) 这个是我们在平常很常用的吧,以前我在用div圆角的时候,特别特别的痛苦,不管是用CSS来画圆角,还是用图片来画圆角都不那么容易,但是现在好了,在CSS3中 ...

  4. 查询oracle数据库中的所有表空间信息

    "空闲比例" totalspace,sum(t.blocks) totalblocks from dba_data_files t group by t.tablespace_na ...

  5. 21个免费的UI设计工具和资源网站,不管是web,js,android都

    本帖最后由 hua631150873 于 2014-9-12 18:26 编辑 Lumzy 官方地址:http://www.lumzy.com/ Lumzy是一个网站应用和原型界面制作工具.使用Lum ...

  6. mybaitis uuid插入和定义返回类型

  7. NSLock/NSRecursiveLock/NSConditionLock/@synchronized

    NSLock/NSRecursiveLock/NSConditionLock/@synchronized http://blog.sina.com.cn/s/blog_8c87ba3b0101ok8y ...

  8. NumPy的详细教程

    原文  http://blog.csdn.net/lsjseu/article/details/20359201 主题 NumPy 先决条件 在阅读这个教程之前,你多少需要知道点python.如果你想 ...

  9. 跟着百度学PHP[4]OOP面对对象编程-11-Final关键字

    Final的作用就是不允许儿子继承夫类,也就是说不能够对父类在进行调用,否则将会出错. 目录------------------------------------------------------ ...

  10. oracle数据库高级应用之《触发器的建立》

    (一)oracle数据库触发器的建立 eg1 CREATE OR REPLACE TRIGGER TRIGGER_ON_TD_DEPARTMENT AFTER INSERT OR UPDATE OR ...