web前端小白入门课程-html和源码表格

主要内容了解表格应用场景表格基本结构如何操作表格表格属性表格跨行跨列表格嵌套案例：表格网页布局表格应用场景XXXXXXXX表格应用场景表格<table><tr><td>行单元格HTML表格tr行td单元格table表格基本语法与结构<!–表格结束--><!–表格开始--><!–

tr

行

--><!–td单元格-->…………<table><tr><td>……</td></tr><tr><td>……</td></tr></table>表格操作添加、删除行与列<table><tr><th>…</th>…</tr><tr><td>…</td>…</tr>…</table>带表头的表格<!–表格头，内容居中、加粗显示--><table><caption>…</caption><tr><th>…</th>…</tr><tr><td>…</td>…</tr>…</table>带标题的表格<!–表格标题，居中显示-->表格划分三部分：表头、主体、脚注thead：表格的头（放标题之类内容）tbody：表格的主体（放数据本体）tfoot：表格的脚

（放表格的脚注）带结构的表格<table><caption>…</caption><thead><tr><th>表头</th></tr></thead><tbody><tr><td>主体</td></tr></tbody><tfoot><tr><td>脚注</td></tr></tfoot></table>带结构的表格表格属性<table>表格属性描述规定表格的宽度表格相对周围元素的对齐方式。规定表格边框的宽度。表格的背景颜色。frame属性值rules属性值属性值描述framevoid不显示外侧边框。above显示上部的外侧边框。below显示下部的外侧边框。hsides显示上部和下部的外侧边框。vsides显示左边和右边的外侧边框。lhs显示左边的外侧边框。rhs显示右边的外侧边框。box在所有四个边上显示外侧边框。border在所有四个边上显示外侧边框。单元边沿与其内容之间的空白。属性

值 描述none

没有线条。groups

位于行组和列组之间的线条。rules

rows

位于行之间的线条。cols 位于列之间的线条。all

位于行和列之间的线条。<table>表格属性表格属性<tr>

属性属性值描述alignLeft、center、right、justify、char行内容的水平对齐valigntop、middle、bottom、baseline行内容的垂直对齐bgcolorrgb(

)#colorname行的背景颜色。<tr>

属性属性值描述bgcolorcolorname规定颜色值为颜色名称的字体颜色（如"red"）。#规定颜色值为十六进制值的字体颜色（如"#ff0000"）。rgb(

)规定颜色值为rgb代码的字体颜色（如"rgb(255,0,0)<td>和<th>

属性属性值描述alignLeft、center、right、justify、char单元格内容的水平对齐valigntop、middle、bottom、baseline单元格内容的垂直对齐bgcolorrgb(

)#colorname单元格的背景颜色。width•%pixels单元格的宽度height•%pixels单元格的高度<thead>、<tbody>和<tfoot>

属性属性值描述alignLeft、center、right、justify、char<thead>、<tbody>和<tfoot>内容的水平对齐valigntop、middle、bottom、baseline<thead>、<tbody>和<tfoot>内容的垂直对齐跨列属性colspan<table><tr><td>…</td><td>…</td><td>…</td></tr><tr><td>…</td><td>…</td><td>…</td></tr></table>跨列属性colspan<table><tr><tdcolspan=“2”>…</td><td>…</td></tr><tr><td>…</td><td>…</td><td>…</td></tr></table>跨行属性rowspan<table><tr><td>…</td><td>…</td><td>…</td></tr><tr><td>…</td><td>…</td><td>…</td></tr></table>跨行属性rowspan<table><tr><td>…</td><td

rowspan=“2”>…</td><td>…</td></tr><tr><td>…</td><td>…</td></tr></table>表格嵌套表格嵌套<table>