前端开发 容器标签 0226

div块级标签

功能：

块级元素，霸占一行

用于页面结构

span内联级标签

功能：

行内元素，可与其它行内标签共处一行

用于页面布局

表格标签 table家庭

table 表格的最外层容器

<table></table>

• border属性 定义表格的边框，设置值是数值
• cellpadding属性 定义单元格内容与边框的距离，设置值是数值
• cellspacing属性 定义单元格与单元格之间的距离，设置值是数值
• align属性 设置整体表格相对于浏览器窗口的水平对齐方式,设置值有：left | center | right
• width属性，设置宽

tr 行标签

<tr></tr>

tr，代表一行。一个表会有多个行

它直属于table

td 单元格标签

<td></td>

单元格是位于行中的

表格的一行里面，会有多个单元格

》单元格标签的属性

• align 设置单元格中内容的水平对齐方式,设置值有：left | center | right
• valign 设置单元格中内容的垂直对齐方式 top | middle | bottom
• colspan 设置单元格水平合并，设置值是数值
• rowspan 设置单元格垂直合并，设置值是数值
• width 设置宽
• height 设置高

th 单元格标题标签

如果单元格是小标题性质，用此标签，单元格会加粗，文本居中

表格功能的演练

使用表格标签完成以下表格的制作

单元格的宽分别为

80 120 80 120 120

颜色编码参考

https://www.114la.com/other/rgb.htm

鸣人的图片

https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=723821193,819125884&fm=26&gp=0.jpg