一旦你理解了行和列的基础知识,并且一旦你明白什么时候可以使用表格以及什么时候应该避免它们,HTML表格很容易创建。
表格和网页设计简史
许多年前,在CSS和Web标准可接受之前,Web设计人员使用HTML
元素为网站创建页面布局。 网站设计将被“切成”小块,如拼图,然后与HTML表格一起在浏览器中按照预期呈现。 这是一个非常复杂的过程,它创建了大量额外的HTML标记,并且在我们的网站所处的多屏世界中 ,这些标记永远无法使用。 随着CSS成为网页视觉效果和布局的可接受方法,使用表格避免了这种情况,许多网页设计师错误地认为“表格很糟糕”。 那是并且是不真实的。 用于布局的表格是不好的,但是它们在网页设计和HTML中仍然占有一席之地,即显示表格数据,如列车时刻表的日历。 对于这个内容,使用表格仍然是一个可以接受的好方法。
那么你怎么布置一张桌子呢? 我们先创建一个简单的2x2表格。 这将有2列(这些是垂直块)和2行(水平块)。 在构建了2x2表后,只需添加其他行或列,即可构建任意大小的表。
难度:一般
所需时间: 10分钟
就是这样:
- 首先打开表格
- 用tr标签
打开第一行 - 用td标签打开第一列
- 编写单元格的内容
- 关闭第一个单元格并打开第二个单元 td>
- 写下第二个单元格的内容
- 关闭第二个单元并关闭行 td> tr>
- 按第一行写第二行
td> | td> tr> - 然后关闭表格 table>
您也可以选择使用 | 元素将表格标题添加到表格中。 这些表头将替换第一个表格行中的“表格数据”片段,如下所示:
Name th> | 角色 tr> | Jeremy td> | Designer td> tr> < td> Jennifer td>开发人员 td> | tr> table> 当此页面在浏览器中呈现时,默认情况下,带表格标题的第一行将以粗体文本显示,并且它们将居中显示在表格单元格中。
那么,在HTML中使用表格可以吗? 是的 - 只要你没有将它们用于布局目的。 如果您需要显示表格信息,则可以使用表格。 事实上,避免使用一些错误的纯度表来回避这种合法的HTML元素,因为在今天这个时代使用它们是为了布局的原因。
由Jennifer Kyrin撰写。 由杰里米吉拉德于8/11/16编辑
| | |