表格
1. 表格的构成:单元格 表格的行 表格的列(p162)
2. 表格属性:对表格属性的设置主要包括表格宽度、高度、填充、间距、对齐方式、边框、背景颜色、边框颜色、背景图片等。(p162-163)
3. 通过HTML代码创建表格(p164)
主要标签 <table></<table> 用来定义一个表格
<tr></tr> 定义表格的一行 必须嵌套在<table>标签之间。
<td></td> 定义表格的单元格 必须嵌套在<tr>标签之间。
<th></th> 表格的头部的一个单元格,表格表头。默认文字粗体居中显示。
<caption></caption>为表格添加标题和摘要。
4. 操作:操作表格(p165-169):
选择整个表格、行/列、单元格
添加行/列
删除行/列
拆分单元格、合并单元格(代码视图 跨行rowspan属性 跨列colspan属性)
5. 操作:绘制细线表格(p170-172)
①利用单元格间距属性,设置为1,单元格与单元格之间产生1像素的距离。
②为表格和单元格分别设置不同的背景颜色。
③透过单元格之间的间距可以看到表格的背景颜色,所以表格的背景颜色就是我们要绘制的细线的颜色。
④为表格和单元格分别添加样式。主要是对<table>、<td>两个标签添加背景颜色。table{background:red;} td{background:blue;}
6. 操作:表格隔行变色(p180-183)
①对表格的奇数行和偶数行分别设置不同的背景颜色来实现隔行变色。
②定义一个不同的表格行<tr>样式 改变颜色 .change{background:#fff;}
③在需要变色的行<tr>标签内 引用该样式<tr class=”change”>
④border属性设置表格边框样式 th{border:1px solid #fff;}