HTML Tables-HTML Table Generator - 书目录

HTML Tables-HTML Table Generator

HTML Table Generator

使用以下HTML表格生成器为您的网站创建一个表格。在HTML中,表可以使用创建<table>,<tr>和<td>元件(以及其它任选元素)。下面的表格生成器自动创建这些标签,以及您决定的任何自定义的相关CSS。

<!-- Codes by HTML.am -->

<!-- CSS Code -->
<style type="text/css" scoped>
table.GeneratedTable {
width:100%;
background-color:#FFFFFF;
border-collapse:collapse;border-width:1px;
border-color:#336600;
border-style:solid;
color:#009900;
}

table.GeneratedTable td, table.GeneratedTable th {
border-width:1px;
border-color:#336600;
border-style:solid;
padding:3px;
}

table.GeneratedTable thead {
background-color:#CCFF99;
}
</style>

<!-- HTML Code -->
<table class="GeneratedTable">
<thead>
<tr>
<th>Header Cell 1</th>
<th>Header Cell 2</th>
<th>Header Cell 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
<td>Row 1, Cell 3</td>
</tr>
<tr>
<td>Row 2, Cell 1</td>
<td>Row 2, Cell 2</td>
<td>Row 2, Cell 3</td>
</tr>
<tr>
<td>Row 3, Cell 1</td>
<td>Row 3, Cell 2</td>
<td>Row 3, Cell 3</td>
</tr>
</tbody>
</table>

定制HTML

生成HTML表格后,您可以通过添加更多HTML元素进一步对其进行自定义。该<table>元素可以包含许多其他HTML元素。如果您添加其中的任何一项,则必须按以下顺序进行:

  1. 可选的<caption>标签
  2. 随后是零个或多个<colgroup>标签
  3. 随后可选择<thead>标签
  4. 随后可选择<tfoot>标签
  5. 随后是零个或多个<tbody>标签或一个或多个<tr>标签
  6. 随后可以选择一个<tfoot>标签(但<tfoot>总共只能有一个标签子)
  7. 可选地与一个或多个脚本支持元件(即,<script>标签或<template>标签)混合

每个<tr>元素代表表中的一行。一行可以有一个或多个<td>或<th>元素,它们决定表中的列。的<td>元素表示表数据和所述<th>元素表示一个表头。

定制CSS

CSS是<style></style>标签之间的代码。这些是确定表格样式的代码。您可以随意更改CSS属性(或添加新属性)。

如果您打算在多个页面中使用相同的样式(例如整个网站),则应将它们移动到外部样式表。

HTML表格代码

您也可能对这些复制/粘贴HTML表格代码感兴趣。

133791

 

英语原文:http://www.html.am/html-generators/html-table-generator.cfm 由工具自动翻译,由书目录整理