当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > HTML中的表格元素

HTML/XHTML教程
XHTML中不再使用HTML中的一些废弃元素
语义化的HTML结构怎么理解
Web 标准学习 理解结构和表现相分离
html5 标签
HTML5 新事件 小结
HTML5 b和i标记将被赋予真正的语义
HTML是网页制作者必须要学习掌握的
HTML DOCTYPE的缩写
Readonly和Disabled的区别
16进制颜色代码(完全)
H标记要在网页制作中合理使用
abbr标记和acronym标记
知名浏览器对DOCTYPE模式的选择机制
用标准dl,dt,dd标签抛弃table列表
html 标签ID可以是变量
iframe 自适应大小实现代码
HTML5 解析规则分析
HTML减肥 精简HTML标记制作网页
HTML5 File API改善网页上传功能
HTML 5 Reset Stylesheet

HTML/XHTML教程 中的 HTML中的表格元素


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 87 ::
收藏到网摘: n/a

  一,<table>标签。<table>标签是表格的标识符,用来界定表格的范围。<table>标签是成对使用的标签,手标签和和尾标签之间的内容就是表格的内容。<table>标签的属性主要有border,width,height,align,cellapcing,cellpasdding.它们都是可选的。 

 

1,border属性的参数值是数字,表示表格边框宽度所占的像素点数。它也可以不带有参数值使用,仅表示该表格是有边框的。例如,<table border=10>表示该表格的边框宽度为10 个像素点。 

2,width和height属性的作用是指定表格的大小。其中width属性用来规定表格的宽度,height属性用以指定表格的高度。这两个属性的参数值可以是数字或者百分数,其中数字表示表格的宽(高)所占的像素点,百分数表示表格的宽(高)占据浏览器窗口的宽(高)度的百分比。例如:<table width=200 height=50%>表示表格的宽度为200个像素点,高度为浏览器窗口高度的50%。 

3,align属性的参数值为left,center和right之一,分别表示表格位于其相邻文字的左侧、表格水平居中和表格位于相邻文字的右侧。例如: 

<html> 
<head> 
<title>测试页面</title> 
</head> 
<body> 
<table border=3 width=60% align=left> 
<TR> 
<TH>单元格</TH><TH>单元格</TH> 
<TH>单元格</TH><TH>单元格</TH><TH>单元格</TH> 
</TR> 
<TR> 
<TD>1</TD><TD>解释项</TD> 
<TD>解释项</TD><TD>同上</TD><TD>同上</TD> 
</TR> 
<TR> 
<TD>2</TD><TD>解释项</TD><TD>同上</TD> 
<TD>又一单元</TD><TD>接着来</TD> 
</TR> 
</table> 

文字说明,这个就是表格居于相邻文字左侧的范例,只要改变一下align的属性参数就可以改变表格的位置了。 

<HR> 

4,cellspacing属性。cellspacing属性用来指定表格各单元格之间的空隙。此属性的参数值是数字,表示单元格间隙所占的像素点数。 

5,cellpadding属性。用来指定单元格内容与单元格边界之间的空白距离的大小。此属性的参数值也是数字,表示单元格内容与上下边界之间空白距离的高度所占像素点数以及单元格内容与左右边界之间空白距离的宽度所占的像素点数。例如: 

<html> 
<head> 
<title>测试页面</title> 
</head> 
<body> 
<HR> 
没加如单元格属性的规定之前的样子:<BR> 
<table border=3> 
<TR> 
<TH>单元格</TH><TH>单元格</TH> 
<TH>单元格</TH><TH>单元格</TH><TH>单元格</TH> 
</TR> 
<TR> 
<TD>1</TD><TD>单元格</TD> 
<TD>单元格</TD><TD>单元格</TD><TD>单元格</TD></TH> 
<TR> 
<TD>2</TD><TD>单元格</TD> 
<TD>单元格</TD><TD>单元格</TD><TD>单元格</TD></TR> 
</table> 
<HR> 
加入单元格属性规定之后的情形:<BR> 
<table border=3 cellspacing=10 cellpadding=10> 
<TR> 
<TH>单元格</TH><TH>单元格</TH> 
<TH>单元格</TH><TH>单元格</TH><TH>单元格</TH> 
</TR> 
<TR> 
<TD>1</TD><TD>单元格</TD> 
<TD>单元格</TD><TD>单元格</TD><TD>单元格</TD></TH> 
<TR> 
<TD>2</TD><TD>单元格</TD> 
<TD>单元格</TD><TD>单元格</TD><TD>单元格</TD></TR> 
</table> 
</body> 
</html> 

接着我们来看看刚刚看到的几个不熟悉的标签是怎么个意思。 

一,<CAPTION>标签。是表格的标题的标签。它是成对使用的标签。在首标签和尾标签之间的内容就是表个的标题。<caption>有两个属性:align和valign它们都是可