18、CSS 表格与元素定位的实用指南

CSS 表格与元素定位的实用指南

1. CSS 表格格式化

在网页设计中，表格是一种常用的元素，用于展示数据和信息。而 CSS 为表格的格式化提供了强大的功能，相比传统的 HTML 标签属性，使用 CSS 样式来定义表格具有诸多优势。

1.1 定义表格样式

虽然 <table> 标签的一些属性（如 border 、 rules 、 cellpadding 和 cellspacing ）仍然存在于严格的 HTML 标准中，但建议使用 CSS 样式来定义表格。使用样式的好处包括一致性、灵活性以及便于后续更改格式。

例如，有如下表格标签：

<table border="1" width="200px" cellpadding="3px" cellspacing="5px">

如果文档中有四个这样的表格，并且有四个类似的文档，当需要减小表格宽度并增加内边距时，若使用标签属性，可能需要编辑 16 个单独的表格；而如果将表格格式化包含在文档顶部的样式中，只需进行四处更改；若将格式化包含在单独的外部样式表中，则只需进行一处更改。

可以使用边框属性控制表格边框，使用内边距和外边距属性影响单元格及其内容的间距。

1.2 控制表格属性

CSS 属性可用于控制表格的格式化，但部分属性的名称与标签属性不匹配。例如，没有