408/notes_estom
1
0
Fork 0
mirror of https://github.com/Estom/notes.git synced 2026-04-13 16:29:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

前端笔记整理完成

Browse Source
This commit is contained in:
estomm
2022-04-18 23:03:54 +08:00
parent bb9110d289
commit 3d6284517e
50 changed files with 5685 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
HTML/html5-basics/html-table.md Normal file
View File

@@ -0,0 +1,104 @@
## 基本表格
表格由 `<table>` 标签来定义。每个表格均有若干行（由 `<tr>` 标签定义），每行被分割为若干单元格（由 `<td>` 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
HTML表格元素:
| 标签 | 属性 |
| --- | --- |
| `<table>` | 定义表格 |
| `<th>` | 定义表格的表头 |
| `<tr>` | 定义表格的行 |
| `<td>` | 定义表格单元 |
| `<caption>` | 定义表格标题 |
| `<thead>` | 定义表格的页眉 |
| `<tbody>` | 定义表格的主体 |
| `<tfoot>` | 定义表格的页脚 |
- 示例代码一:
```html
<!DOCTYPE html>
<html>
<head>
<title>17_基本表格.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<table>
<tr>
<td><b>名称</b></td><td><b>性别</b></td><td><b>年龄</b></td>
</tr>
<tr>
<td>张三</td><td>男</td><td>18</td>
</tr>
<tr>
<td>李四</td><td>女 </td><td>16</td>
</tr>
</table>
</body>
</html>
```
- 示例代码二:
```html
<!DOCTYPE html>
<html>
<head>
<title>17_基本表格.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<table border="1" width="20%" rules="rows" frame="below">
<tr>
<td><b>名称</b></td><td><b>性别</b></td><td><b>年龄</b></td>
</tr>
<tr>
<td>张三</td><td>男</td><td>18</td>
</tr>
<tr>
<td>李四</td><td>女 </td><td>16</td>
</tr>
</table>
</body>
</html>
```
- 示例代码三:
```html
<!DOCTYPE html>
<html>
<head>
<title>17_基本表格.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<table border="1" width="20%">
<tr align="center">
<td><b>名称</b></td><td><b>性别</b></td><td><b>年龄</b></td>
</tr>
<tr>
<td>张三</td><td>男</td><td>18</td>
</tr>
<tr>
<td>李四</td><td>女 </td><td>16</td>
</tr>
</table>
</body>
</html>
```
- 示例代码四:
```html
<!DOCTYPE html>
<html>
<head>
<title>17_基本表格.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<table border="1" width="20%">
<tr align="center">