实例
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>8.12菜单</title> <link type="text/css" rel="stylesheet" href="8.12%20zuo.css"> </head> <body> <!-- 1、<table>...</table>定义表格 2、caption标签,为表格添加标题和摘要 3、table border=# width=# height=# 边框尺寸|cellspacing=# 表格间隙 | summary=# 表格摘要 4、<caption>...</caption>表格标题--> <div class="beijin"> <table border="1" width="400" height="200" cellspacing="1" summary="表格摘要" class="bbb1"> <caption>菜单</caption> <!-- tbody 标记用于定义表格主体,改善网页浏览速度 --> <tbody> <!-- 1、tr th td align=# #=left, center, right 文字对齐 2、<th>…</th>:表格表头 3、<td>…</td>:表格的一个单元格 4、<tr>…</tr>:表格的一行 --> <tr align="center"> <th align="center">序号</th> <th align="center">菜名</th> <th align="center">价格</tth> </tr> <tr align="center"> <td align="center">1</td> <td align="center">表格</td> <td align="center">表格</td> <tr align="center"> <td align="center">2</td> <td align="center">表格</td> <td align="center">表格</td> </tr> <tr align="center"> <td align="center">3</td> <td align="center">表格</td> <td align="center">表格</td> <tr align="center"> <td align="center">4</td> <td align="center">表格</td> <td align="center">表格</td> </tr> <tr align="center"> <td align="center">5</td> <td align="center">表格</td> <td align="center">表格</td> <tr align="center"> <td align="center">6</td> <td align="center">表格</td> <td align="center">表格</td> </tr> <tr align="center"> <td align="center">7</td> <td align="center">表格</td> <td align="center">表格</td> <tr align="center"> <td align="center">8</td> <td align="center">表格</td> <td align="center">表格</td> </tr> <tr align="center"> <td align="center">9</td> <td align="center">表格</td> <td align="center">表格</td> <tr align="center"> <td align="center">10</td> <td align="center">表格</td> <td align="center">表格</td> </tr> <tr align="center"> <td align="center">11</td> <td align="center">表格</td> <td align="center">表格</td> <tr align="center"> <td align="center">12</td> <td align="center">表格</td> <td align="center">表格</td> </tr> </table> </div> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>8.12菜单</title>
<link type="text/css" rel="stylesheet" href="8.12%20zuo.css">
</head>
<body>
<!-- 1、<table>...</table>定义表格
2、caption标签,为表格添加标题和摘要
3、table border=# width=# height=# 边框尺寸|cellspacing=# 表格间隙 | summary=# 表格摘要
4、<caption>...</caption>表格标题-->
<div class="beijin">
<table border="1" width="400" height="200" cellspacing="1" summary="表格摘要" class="bbb1">
<caption>菜单</caption>
<!-- tbody 标记用于定义表格主体,改善网页浏览速度 -->
<tbody>
<!-- 1、tr th td align=# #=left, center, right 文字对齐
2、<th>…</th>:表格表头
3、<td>…</td>:表格的一个单元格
4、<tr>…</tr>:表格的一行 -->
<tr align="center">
<th align="center">序号</th>
<th align="center">菜名</th>
<th align="center">价格</tth>
</tr>
<tr align="center">
<td align="center">1</td>
<td align="center">表格</td>
<td align="center">表格</td>
<tr align="center">
<td align="center">2</td>
<td align="center">表格</td>
<td align="center">表格</td>
</tr>
<tr align="center">
<td align="center">3</td>
<td align="center">表格</td>
<td align="center">表格</td>
<tr align="center">
<td align="center">4</td>
<td align="center">表格</td>
<td align="center">表格</td>
</tr>
<tr align="center">
<td align="center">5</td>
<td align="center">表格</td>
<td align="center">表格</td>
<tr align="center">
<td align="center">6</td>
<td align="center">表格</td>
<td align="center">表格</td>
</tr>
<tr align="center">
<td align="center">7</td>
<td align="center">表格</td>
<td align="center">表格</td>
<tr align="center">
<td align="center">8</td>
<td align="center">表格</td>
<td align="center">表格</td>
</tr>
<tr align="center">
<td align="center">9</td>
<td align="center">表格</td>
<td align="center">表格</td>
<tr align="center">
<td align="center">10</td>
<td align="center">表格</td>
<td align="center">表格</td>
</tr>
<tr align="center">
<td align="center">11</td>
<td align="center">表格</td>
<td align="center">表格</td>
<tr align="center">
<td align="center">12</td>
<td align="center">表格</td>
<td align="center">表格</td>
</tr>
</table>
</div>
</body>
</html>