HTMLHTML 表格 ① ( 表格标签 | 行标签 | 单元格标签 | table 表格属性 | border 属性 | align 属性 | width 属性 | height 属性 )
Posted 韩曙亮
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了HTMLHTML 表格 ① ( 表格标签 | 行标签 | 单元格标签 | table 表格属性 | border 属性 | align 属性 | width 属性 | height 属性 )相关的知识，希望对你有一定的参考价值。
文章目录
一、表格标签组成 ( 表格标签 | 行标签 | 单元格标签 )
HTML 表格 由 3 种标签 组成 : 表格 涉及 的标签都是 双标签 ;
- 表格标签 : 表格最 外围的标签 , 用于包裹整个表格 ; 其中 包含若干 tr 行标签 ;
<table>整个表格内容</table>
- 行标签 : 标签内是 一行的内容 , 其中 包含若干 td 标签 ;
<tr>表格中一行的内容</tr>
- 单元格标签 : 表格中一个单元格中的内容 , 只包含一个单元格的文本 ;
<td>单元格文本内容</td>
代码示例 :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>网页标题</title>
<base target="_blank"/>
</head>
<body>
<!-- 整个表格内容 -->
<table>
<!-- 表格中一行的内容 -->
<tr>
<!-- 表格中单个单元格内容 -->
<td>姓名</td>
<td>年龄</td>
</tr>
<tr>
<td>Tom</td>
<td>18</td>
</tr>
<tr>
<td>Jerry</td>
<td>16</td>
</tr>
</table>
</body>
</html>
网页效果 :
二、table 表格属性 ( border 属性 | align 属性 | width 属性 | height 属性 )
table 表格属性 :
- border 属性 : 属性值 为 像素值 ; 设置边框 , 默认 0 像素 无边框 ;
- cellspacing 属性 : 属性值 为 像素值 ; 设置 单元格边框 之间的 间距 , 默认 2 像素 ;
- cellpadding 属性 : 属性值 为 像素值 ; 设置 单元格边框 与 单元格内容 之间的 间距 , 默认 1 像素 ;
- width 属性 : 属性值 为 像素值 ; 设置 表格宽度 ;
- height 属性 : 属性值 为 像素值 ; 设置 表格高度 ;
- align 属性 : 可设置 left , center , right 等属性值 ; 用于设置 整体表格 在 网页中的 水平对齐方式 ;
- 设置 left , 表格在网页左侧 ;
- 设置 center , 表格在网页水平居中 ;
- 设置 right , 表格在网页右侧 ;
代码示例 :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>网页标题</title>
<base target="_blank"/>
</head>
<body>
<!-- 整个表格内容 -->
<table border="1" width="500" height="200"
align="center" cellpadding="10" cellspacing="0">
<!-- 表格中一行的内容 -->
<tr>
<!-- 表格中单个单元格内容 -->
<td>姓名</td>
<td>年龄</td>
</tr>
<tr>
<td>Tom</td>
<td>18</td>
</tr>
<tr>
<td>Jerry</td>
<td>16</td>
</tr>
</table>
</body>
</html>
网页效果 :
以上是关于HTMLHTML 表格 ① ( 表格标签 | 行标签 | 单元格标签 | table 表格属性 | border 属性 | align 属性 | width 属性 | height 属性 )的主要内容，如果未能解决你的问题，请参考以下文章
HTMLHTML 表格 ② ( 表头单元格标签 | 表格标题标签 )
HTMLHTML 表格总结 ★★★ ( 表格标签 | 行标签 | 单元格标签 | 表格标签属性 | 表头单元格标签 | 表格标题标签 | 合并单元格 )
HTMLHTML 注册表单案例 ② ( 表格中的内容设置 | 下拉列表 | 输入文本框 | 复选框 | 文本域 | 图片按钮 | 链接 )
HTMLHTML 表格 ③ ( 合并单元格 | 跨行合并 | 跨列合并 | 单元格合并顺序 | 跨行设置 rowspan 属性 | 跨列设置 colspan 属性 )