📄 0043.htm
字号:
<html>
<head>
<title>新时代软件教程:操作系统 主页制作 服务器 设计软件 网络技术 编程语言 文字编辑</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
<!--
body, table {font-size: 9pt; font-family: 宋体}
a {text-decoration:none}
a:hover {color: red;text-decoration:underline}
.1 {background-color: rgb(245,245,245)}
-->
</style>
</head>
<p align="center"><script src="../../1.js"></script></a>
<p align="center"><big><strong>表格进阶</strong></big></p>
<div align="right">---摘自《网页设计师》</div>
表格的色彩
<p><font color="#008000">
表元的背景色彩和背景图象</font><br>
<th bgcolor=#><br>
<th background="URL">
<dl>
<dd>#=rrggbb 16 进制 RGB 数码, 或者是下列预定义色彩名称：<br>
<font color="#000000">Black</font>, <font color="#808000">Olive</font>, <font color="#008080">Teal</font>,
<font color="#ff0000">Red</font>, <font color="#0000ff">Blue</font>, <font color="#800000">Maroon</font>,
<font color="#000080">Navy</font>, <font color="#808080">Gray</font>, <font color="#00ff00">Lime</font>,<br>
<font color="#ff00ff">Fuchsia</font>, <font color="#ffffff">White</font>,
<font color="#008000">Green</font>, <font color="#800080">Purple</font>,
<font color="#c0c0c0">Silver</font>, <font color="#ffff00">Yellow</font>,
<font color="#00ffff">Aqua</font></dd>
</dl>
<pre><table border>
<tr><th bgcolor=ffaa00>Food</th>
<th bgcolor=Red>Drink</th>
<th rowspan=2 background="image.gif">Sweet</th>
<tr bgcolor=white><td>A</td><td>B</td>
</table>
</pre>
<table border="1">
<tbody>
<tr>
<th bgColor="#ffaa00">Food</th>
<th bgColor="red">Drink</th>
<th background="file:///D:/0825/HTML7-1.htm/HTML7-1.files/image.gif" rowSpan="2">Sweet</th>
</tr>
<tr bgColor="white">
<td>A</td>
<td>B</td>
</tr>
</tbody>
</table>
<p> </p>
<p><!------Border Color------->
</p>
表格边框的色彩<br>
<table bordercolor=#>
<pre><table cellspacing=5 border=5 bodercolor=#ffaa00>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
</pre>
<table border="5" borderColor="#ffaa00" cellSpacing="5">
<tbody>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</tbody>
</table>
<p><!------Light & Dark Border Color------->
</p>
表格边框色彩的亮度控制<br>
<table bordercolorlight=#><br>
<table bordercolordark=#>
<pre><table cellspacing=5 border=5
bordercolorlight=White bordercolordark=Maroon>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
</pre>
<table border="5" borderColorDark="maroon" borderColorLight="white" cellSpacing="5">
<tbody>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</tbody>
</table>
<p> </p>
<p><!--################## Structured Table ########################-->
<a name="group"></a></p>
<font color="#008000">表格的分组显示(Structured Table)</font>
<p><!------Groups of Rows------->
</p>
按行分组<br>
<thead> ... </thead> - 表的题头(Header)<br>
<tbody> ... </tbody> - 表的正文(Body)<br>
<tfoot> ... </tfoot> - 表的脚注(Footer)
<pre><table border>
<thead>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
</thead>
<tbody>
<tr><td>A</td><td>B</td><td>C</td>
<tr><td>D</td><td>E</td><td>F</td>
</tbody>
</table>
</pre>
<table border="1">
<tbody>
<tr>
<td>
</tr>
<thead>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
<td> </td>
</tr>
</thead>
<tbody>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
<td>F</td>
<td> </td>
</tr>
</tbody>
</table>
<p><!------Groups of Columns------->
</p>
按列分组<br>
<colgroup align=#> #=left, right, center
<pre><table border width=160>
<colgroup align=left>
<colgroup align=center>
<colgroup align=right>
<thead>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
</thead>
<tbody>
<tr><td>A</td><td>B</td><td>C</td>
<tr><td>D</td><td>E</td><td>F</td>
</tbody>
</table>
</pre>
<table border="1" width="160">
<tbody>
<tr>
<td>
</tr>
<colgroup align="left">
<colgroup align="middle">
<colgroup align="right">
<thead>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
<td> </td>
</tr>
</thead>
<tbody>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
<td>F</td>
<td> </td>
</tr>
</tbody>
</table>
<p><!------Groups of Columns------->
</p>
列的属性控制<br>
<col span=#> #=从左数起，具有指定属性的列的列数<br>
<col align=#> #=left, right, center
<pre><table border width=160>
<colgroup>
<col align=center span=2>
<colgroup align=right>
<thead>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
</thead>
<tbody>
<tr><td>A</td><td>B</td><td>C</td>
<tr><td>D</td><td>E</td><td>F</td>
</tbody>
</table>
</pre>
<table border="1" width="160">
<tbody>
<tr>
<td>
</tr>
<colgroup>
<col align="middle" span="2">
<colgroup align="right">
<thead>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
<td> </td>
</tr>
</thead>
<tbody>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
<td>F</td>
<td> </td>
</tr>
</tbody>
</table>
<p><!--################## Frame ########################-->
<a name="frame"></a></p>
<font color="#008000">表格中边框的显示</font>
<p><!------all------->
</p>
显示所有 4 个边框 <table frame=box>
<pre><table border frame=box>
<thead>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
</thead>
<tbody>
<tr><td>A</td><td>B</td><td>C</td>
<tr><td>D</td><td>E</td><td>F</td>
</tbody>
</table>
</pre>
<table border="1" frame="box">
<tbody>
<tr>
<td>
</tr>
<thead>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
<td> </td>
</tr>
</thead>
<tbody>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
<td>F</td>
<td> </td>
</tr>
</tbody>
</table>
<p><!------above------->
</p>
只显示上边框 <table frame=above>
<table border="1" frame="above">
<tbody>
<tr>
<td>
</tr>
<thead>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
<td> </td>
</tr>
</thead>
<tbody>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
<td>F</td>
<td> </td>
</tr>
</tbody>
</table>
<p><!------below------->
</p>
只显示下边框 <table frame=below>
<table border="1" frame="below">
<tbody>
<tr>
<td>
</tr>
<thead>
<tr>
<th>Food</th>
<th>Drink</th>
<th>Sweet</th>
<td> </td>
</tr>
</thead>
<tbody>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
<td>F</td>
<td> </td>
</tr>
</tbody>
</table>
<p><!------hsides------->
</p>
只显示上、下边框 <table frame=hsides>
<table border="1" frame="hsides">
<tbody>
<tr>
<td>
</tr>
<thead>
<tr>
<th>Food</th>
<th>Drink</th>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -