表格相关知识

今天主要讲的表格table

一、基本结构:

<table>

         <tr>

               <th></th>

               <th></th>

         </tr>

         <tr>

               <td></td>

               <td></td>

         </tr>

      </table>

解释:

table:表格

tr:行

td:单元格

th:表头,和td一个级别

还有一些其他元素:

caption:表格标题,默认在表格上方居中显示,和tr一个级别

还有thead,tbody,tfoot,不常用,平时不用写,浏览器会给加上,注意层级顺序即可

二、属性:

1、 table属性:

width:宽度

border:边框(设置边框后,td也会默认显示1px的边框)

cellpadding:单元格边沿与其内容之间的空白

cellspacing:单元格之间的空间

align:水平方向对齐方式

2、 tr属性

height、align等

3、 td属性

valign:垂直方向对齐方式

还有width 、height、align等

三、单元格的合并

colspan:水平合并/向右合并

rowspan:垂直合并/向下合并

合并的本质:通过占位实现合并

学习重点:

1、正确嵌套table

2、单元格的合并

今天的课还是很有意思的,在练习中体验了一下整个页面全部用table布局,写的时候,注意先把标签写好,成对写,正确闭合,再写标签里面的内容,就不会出现嵌套错误了。

原文地址:https://www.cnblogs.com/hzhjxx/p/9585461.html