竭诚为您提供优质文档/双击可除
table,表格居中
篇一：table表格
table标签
用table表格对网页中的内容进行排版，是一种既常见又较为方便的方法，在目前仍有许多网页是使用表格排版的。
首标签表示表格的开始，尾标签则表示表格结束，一个简单的html表格中分别包含以下元素：
th：元素定义表头单元格，th中包含的文本内容默认以粗体显示，即使不为它设置align属性，元素中的内容也会自动居中显示；
tr：表格中的行标记，和分别表示表格中一行的开始与结束，如果表格需要4行，则需要用到4组tr；
td：表格中的单元格，也称之为列标记，td元素需被
tr元素所包含；
以上的元素都必须写在table标签中才有效。
下面就通过一组实例来创建一个三行三列的table表格：
表头1
表头2
表头3
第二行第一列
第二行第二列
第二行第三列
第三行第一列
第三行第二列
第三行第三列
上述代码中为table设置的属性依次为：
width（table宽度）="450"默认单位为像素值；
height（table高度）="120"默认单位为像素值；
border（table边框线）="1"表格及所有单元格的边框线；
align（table水平位置）="center"设置表格水平居中显示；
现在打开浏览器，运行以上代码来看看table表格创建完成后的效果吧！
table表格的高度与宽度除了可以设置固定值外，还可以使用百分比来设置；table表格中的th元素包含的内容会自动居中显示，如需让td元素中的内容也居中显示，只需设置即可；不过在现在的html5中，table中的属性仅支持"border"属性，并且只允许使用值"1"或"无"。
篇二：html表格布局实例
[html]表格布局之实例版
|[>]
前面我们讲了html表格的基础知识，今天我们通过一个实例让大家更清晰的了解下表格的用途。
例如：我们做一个简单的网站布局，代码如下：
bordercolor="#00ff99">
网站名称
网站标题
搜索框
左边
中间
右边
网站底部信息
产生如下的表格：
这是一张整体的表格，第一行和第四行分别跨度了三列，这里用
colspan="3"来限制，而第二行的“搜索框”占用了两
列的位置，用colspan="2"控制；align="center"是对表格
内文字的对齐限制，center表示中间，right表示靠右，left 靠左。
表格的基础设置，可以参考：
[html]利用表格规划网站布局
[html]如何制作多行多列的表格
[html]设定表格的尺寸和边框
如果你现在可以根据自己的想法制作出一个表格了，那么你就是向自己制作模板迈近了一步。
^o^
表格布局现在仍然很多人在用，方便实在。
网页设计现有两种布局方法，一种即是表格布局，另一种是现在w3c极力推荐的css布局。
不过，就目前来说，由于xhtml并未完全占据主流，表格布局依然是大多数网页设计师的首选。
你所描述的问题属于表格的对齐问题，解决方式有以下几种：
如果两个表格的宽度不一致，那么选择默认的对齐方式，也即左对齐，在html中的标签和属性是：就能实现左边对齐。
你现在出现的问题有可能是第一个表格设置了对齐方式，例如居中对齐，而第二个表格并没有设置对齐方式，所以默认为左对齐，这样就出现了上述问题。
我的一些表格布局的经验：
1、表格布局第一步：先插入一个表格，宽度是760-780px （记住，一定要用px，不要用百分比），高度不用设置，然
后令这个表格居中。
以后所有的内容都限制在这个表格中。
2、熟练使用表格嵌套。
也就是说，在一个表格中再插
入另一个表格。
举个例子，把你要设计的页面分成大的几个部分，然后利用表格的行数和列数来控制它们的布局，如果某一个单元格中的内容又要分成几部分，可以继续在这个单元格中插入表格，方法同上。
3、补充：表格的边框一定要为0，即table中的border 属性值为"0"。
也就是让表格在网页预览中不可见，这样才
能实现表格布局的目的。
如何利用表格实现画中画，也就是页中页效果
网页的排版大多使用表格，利用一个表个单元可以嵌入一个网页，你知道吗？这样做有很多好处，比如你把经常更新的区域划分一个表格单元，然后在这个表
格单元中嵌入你想要更新的内容，今后更新主页只需上传这个被嵌套的页面就可以了，没有必要对首页进行更新，是不是很方便。
我写个最简单的例子代码：＜html＞＜head＞
＜title＞范例＜/title＞
＜body＞
＜tableborder="1"width="100%"＞
＜tr＞
＜td＞
＜
iFRamesrc="example.htm"width="300"heitht="100"＞＜
/iFRame＞＜/td＞
＜/tr＞
＜/table＞
＜/body＞
＜/html＞
插入被嵌入页的关键代码是：＜
iFRamesrc="example.htm"width="300"heitht="100"
＞＜/iFRame＞。
example.htm是被嵌入的页面，标签＜iFRame＞还有一些可用的参数设置如下：marginwidth:网页中内容在表格右侧的预留宽度；例如：marginwidth="20"，单位是pix，下同。
marginheight:网页中内容在表格顶部预留的高度；
hspace:网页右上角的的横坐标；
vspace:网页右上角的纵坐标；
frameborder:是否显示边缘；填"1"表示"是"，填"0"表示"否"
scrolling:是否出现滚动条；填"1"表示"是"，填"0"表示"否"
表格背景图片的一个技巧
大家都知道在一个较大的表格中放入背景图片，背景图片就会重复填充直到整个页面。
我们可以利用表格的这个特性来减小我们网页中图片的大小，比如下面的一个渐变图，你看上去像是一整张图片，它其实用的就是表格背景重复填充特性，而用的图片就是右边的那张，大小只有1.3k，在此如果要用一张大的图片是很不划算的。
你若要插入一根水平线，用这方法也很有效。
如何使鼠标指到表格，表格背景变色
这个特效用的是表格样式表，要达到此效果你只需在＜td＞代码中加入
onmouseout="this.style.backgroundcolor="""onmouseov er="this.style.backgroundcolor="#FFcccc""，例：表格布局常见问题解答
发布时间：20xx-05-20
1、表格布满页面的问题
我们在很多地方看到为了使页面适应不同的分辨率，通常将表格的大小按百分比设置。
刚开始学做网页的时候，我已经把表格的宽度设置为100%，但在浏览器上还是不能满屏显示，四周总有一圈空白，我曾对此感到迷惑不解，后来在论坛请教才知道这不是表格的错。
如果你用dreamweaver制作网页，这个问题很好解决，选择菜单modify--＞pageproperties,在弹出的对话框里设置left、top为0就ok了！
2.表格的变形问题
网页在不同的屏幕分辨率、或改变窗口时常出现一些页面变形情况，这也是最另人恼火的事，怎么办呢秋实曾在天极网页陶吧撰文详细的阐述过这个问题，我们来看看他是怎么解决的。
a、因为表格排列设置而在不同分辨率下所出现的错位。