html,表格,左对齐.doc

html,表格,左对齐 篇一：html表格布局实例 [html]表格布局之实例版 | [lt;lt;] [] 前面我们讲了html表格的基础知识，今天我们通过一个实例让大家更清晰的了解下表格的用途。 例如：我们做一个简单的网站布局，代码如下： lt;table align=center width=500 height=400 border=1 bordercolor=#00ff99 lt;tbody lt;trlt;td colspan=3 align=center网站名称lt;/td lt;/tr lt;trlt;td width=30% height=25网站标题lt;/td lt;td colspan=2 align=right搜索框lt;/td lt;/tr lt;trlt;td width=30%左边lt;/td lt;td width=40%中间lt;/td lt;td右边lt;/td lt;/tr lt;trlt;td colspan=3 align=center网站底部信息lt;/td lt;/tr lt;/tbody lt;/table 产生如下的表格： 这是一张整体的表格，第一行和第四行分别跨度了三列，这里用 colspan=3来限制，而第二行的“搜索框”占用了两列的位置，用colspan=2控制； align=center是对表格内文字的对齐限制，center表示中间，right表示靠右，left靠左。 表格的基础设置，可以参考： [html]利用表格规划网站布局 [h择默认的对齐方式，也即左对齐，在html中的标签和属性是：lt;table align=leftlt;/table就能实现左边对齐。你现在出现的问题有可能是第一个表格设置了对齐方式，例如居中对齐，而第二个表格并没有设置对齐方式，所以默认为左对齐，这样就出现了上述问题。 我的一些表格布局的经验： 1、表格布局第一步：先插入一个表格，宽度是760-780px（记住，一定要用px，不要用百分比），高度不用设置，然后令这个表格居中。以后所有的内容都限制在这个表格中。 2、熟练使用表格嵌套。也就是说，在一个表格中再插入另一个表格。举个例子，把你要设计的页面分成大的几个部分，然后利用表格的行数和列数来控制它们的布局，如果某一个单元格中的内容又要分成几部分，可以继续在这个单元格中插入表格，方法同上。 3、补充：表格的边框一定要为0，即table中的border属性值为0。也就是让表格在网页预览中不可见，这样才能实现表格布局的目的。 如何利用表格实现画中画，也就是页中页效果 网页的排版大多使用表格，利用一个表个单元可以嵌入一个网页，你知道吗？这样做有很多好处，比如你把经常更新的区域划分一个表格单元，然后在这个表 格单元中嵌入你想要更新的内容，今后更新主页只需上传这个被嵌套的页面就可以了，没有必要对首页进行更新，是不是很方便。我写个最简单的例子代码：＜html＞ ＜head＞ ＜title＞范例＜/title＞ ＜body＞ ＜table border=1 width=100%＞ ＜tr＞ ＜td＞ ＜IFRAME src=example.htm width=300 heitht=100＞＜/IFRAME＞ ＜/td＞ ＜/tr＞ ＜/table＞ ＜/body＞ ＜/html＞ 插入被嵌入页的关键代码是：＜ IFRAME src=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