一、表格概念:
1.作用:(1)显示数据 (2)布局,解决较规则布局
2.结构: 表格table-->行tr-->单元格td
二、<table>,<tr>,<td>
1.<table>属性:
width,height:宽和高
border,bordercolor,bgcolor: 边框宽度,边框颜色,背景颜色
align:对齐 left/center/right,指表格
style="border:1px;border-color:red;background-color:yellow"
2.<tr>,<td>
align,valign: 水平对齐方式/垂直对齐方式(top/middle/bottom)
3.难点:<table>
cellspacing:设置单元格之间的间隙,布局时一般为0
cellpadding:设置单元格与内容之间的间隙,布局时一般为0
<td>
rowspan:跨行
colspan:跨列
三、<caption>表标题,表格中间,写代码时写在<table>里面
<th> 列标题,内容加粗居中, 相当td
<thead>表头
<tbody>表主体
<tfoot>表尾
对表格进行逻辑分区
复习:
1。作用:布局,显示数据
2。常用标签:<table>,<tr>,<td>
table常用属性:width,height,border,borderColor,bgColor,align,cellspacing,cellpadding
td和tr常用属性:colspan,rowspan,align,valign
3. 其他的标签:
<caption>
<th>
<thead>,<tbody>,<tfoot>
表格边框的显示与隐藏,是可以用frame参数来控制的。请注意它只控制表格的边框图,而不影晌单元格。
只显示上边框 <table frame=above>
只显示下边框 <table frame=below>
只显示左、右边框 <table frame=vsides>
只显示上、下边框 <table frame=hsides>
只显示 左边框 <table frame=lhs>
只显示右边框 <table frame=rhs>
不显示任何边框 <table frame=void>
二、表格内部分隔线的属性
起作用的是rules这个参数,它有三个值(cols,rows,none),当rules=cols时,表格会隐藏横向的分隔线,也就是我们只能看到表 格的列;当rules=rows时,就隐藏了纵向的分隔线,也就是我们只能看到表格的行;而当rules=none时,纵向分隔线和横向分隔线将全部隐 藏,我们就只能看到一个表格的外框了。看一下下面的对比效果你就会明白的
这是最普通的表格形式
这是隐藏了横向分隔线的表格,即rules=cols
这是隐藏了纵向分隔线的表格,即rules=rows
这是隐藏了所有内部分隔线的表格,即rules=none