⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 html6.htm

📁 HTML的入门教程
💻 HTM
字号:
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb_2312-80">
<META NAME="Generator" CONTENT="Microsoft Word 97">
<TITLE>HTML语言教程之六:表格(TABLE)标记</TITLE>
<META NAME="Template" CONTENT="C:\PROGRAM FILES\MICROSOFT OFFICE\OFFICE\html.dot">
<link rel="stylesheet" href="../../cpcw.css"></HEAD>
<BODY LINK="#0000ff" VLINK="#800080" background="../bg.gif">
<table width="85%" border="0" align="center">
  <tr bgcolor="#FFFFFF"> 
    <td>
      <p align="CENTER"><font size="6" lang="ZH-CN"><font color="#FF3333" class="title"><b>HTML语言教程之六:表格(TABLE)标记</b></font></font></p>
      <p align="JUSTIFY"></p>
      <hr>
      <h1 align=left><a name="basic"></a><!--################## Basic ########################--></h1>
      <h2> 表格的基本语法</h2>
      <h3>&lt;table&gt;...&lt;/table&gt; - 定义表格<br>
        &lt;tr&gt; - 定义表行<br>
        &lt;th&gt; - 定义表头<br>
        &lt;td&gt; - 定义表元(表格的具体数据)</h3>
      带边框的表格: 
      <pre>&lt;table border&gt;
&lt;tr&gt;&lt;th&gt;Food&lt;/th&gt;&lt;th&gt;Drink&lt;/th&gt;&lt;th&gt;Sweet&lt;/th&gt;
&lt;tr&gt;&lt;td&gt;A&lt;/td&gt;&lt;td&gt;B&lt;/td&gt;&lt;td&gt;C&lt;/td&gt;      
&lt;/table&gt;

</pre>
      <table border>
        <tr> 
          <th>Food</th>
          <th>Drink</th>
          <th>Sweet</th>
        </tr>
        <tr> 
          <td>A</td>
          <td>B</td>
          <td>C</td>
        </tr>
      </table>
      <p> <br>
        不带边框的表格: 
      <pre>&lt;table&gt;
&lt;tr&gt;&lt;th&gt;Food&lt;/th&gt;&lt;th&gt;Drink&lt;/th&gt;&lt;th&gt;Sweet&lt;/th&gt;
&lt;tr&gt;&lt;td&gt;A&lt;/td&gt;&lt;td&gt;B&lt;/td&gt;&lt;td&gt;C&lt;/td&gt;      
&lt;/table&gt;

</pre>
      <table>
        <tr> 
          <th>Food</th>
          <th>Drink</th>
          <th>Sweet</th>
        </tr>
        <tr> 
          <td>A</td>
          <td>B</td>
          <td>C</td>
        </tr>
      </table>
      <pre>
</pre>
      <p><!--################## Table Span ########################--><a name="span"></a></p>
      <h2> 跨多行、多列的表元(Table Span)</h2>
      <p><!------Colspan-------></p>
      <h3>跨多列的表元 &lt;th colspan=#&gt;</h3>
      <pre>&lt;table border&gt;
&lt;tr&gt;&lt;th colspan=3&gt; Morning Menu&lt;/th&gt;
&lt;tr&gt;&lt;th&gt;Food&lt;/th&gt;       &lt;th&gt;Drink&lt;/th&gt;  &lt;th&gt;Sweet&lt;/th&gt;
&lt;tr&gt;&lt;td&gt;A&lt;/td&gt;&lt;td&gt;B&lt;/td&gt;&lt;td&gt;C&lt;/td&gt;
&lt;/table&gt;

</pre>
      <table border>
        <tr> 
          <th colspan=3>Morning Menu</th>
        </tr>
        <tr> 
          <th>Food</th>
          <th>Drink</th>
          <th>Sweet</th>
        </tr>
        <tr> 
          <td>A</td>
          <td>B</td>
          <td>C</td>
        </tr>
      </table>
      <p><!------Rowspan-------></p>
      <h3>跨多行的表元 &lt;th rowspan=#&gt;</h3>
      <pre>&lt;table border&gt;
&lt;tr&gt;&lt;th rowspan=3&gt; Morning Menu&lt;/th&gt;
        &lt;th&gt;Food&lt;/th&gt; &lt;td&gt;A&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;th&gt;Drink&lt;/th&gt; &lt;td&gt;B&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;th&gt;Sweet&lt;/th&gt; &lt;td&gt;C&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;

</pre>
      <table border>
        <tr> 
          <th rowspan=3>Morning Menu</th>
          <th>Food</th>
          <td>A</td>
        </tr>
        <tr> 
          <th>Drink</th>
          <td>B</td>
        </tr>
        <tr> 
          <th>Sweet</th>
          <td>C</td>
        </tr>
      </table>
      <pre>
</pre>
      <p><!--################## Size ########################--><a name="size"></a></p>
      <h2> 表格尺寸设置</h2>
      <p><!------Border-------></p>
      <h3>&lt;table border=#&gt;</h3>
      边框尺寸设置: 
      <pre>&lt;table border=10&gt;
&lt;tr&gt;&lt;th&gt;Food&lt;/th&gt;&lt;th&gt;Drink&lt;/th&gt;&lt;th&gt;Sweet&lt;/th&gt;
&lt;tr&gt;&lt;td&gt;A&lt;/td&gt;&lt;td&gt;B&lt;/td&gt;&lt;td&gt;C&lt;/td&gt;      
&lt;/table&gt;

</pre>
      <table border=10 >
        <tr> 
          <th>Food</th>
          <th>Drink</th>
          <th>Sweet</th>
        </tr>
        <tr> 
          <td>A</td>
          <td>B</td>
          <td>C</td>
        </tr>
      </table>
      <p><!------Length-------></p>
      <h3>&lt;table border width=# height=#&gt;</h3>
      表格尺寸设置: 
      <pre>&lt;table border width=170 height=100&gt;
&lt;tr&gt;&lt;th&gt;Food&lt;/th&gt;&lt;th&gt;Drink&lt;/th&gt;&lt;th&gt;Sweet&lt;/th&gt;
&lt;tr&gt;&lt;td&gt;A&lt;/td&gt;&lt;td&gt;B&lt;/td&gt;&lt;td&gt;C&lt;/td&gt;      
&lt;/table&gt;

</pre>
      <table border width="170" height="100" >
        <tr> 
          <th>Food</th>
          <th>Drink</th>
          <th>Sweet</th>
        </tr>
        <tr> 
          <td>A</td>
          <td>B</td>
          <td>C</td>
        </tr>
      </table>
      <h2><blink> </blink></h2>
      <p align="CENTER">
<a href="html1.htm">页面标记|</a>
        <a href="html2.htm">字体标记|</a>
        <a href="html3.htm">文字布局|</a>
        <a href="html4.htm">图像标记|</a>
        <a href="html5.htm">表单标记|</a>
        <a href="html6.htm">表格标记|</a>
        <a href="html7.htm">表格进阶|</a>
        <a href="html8.htm">多窗口|</a>
        <a href="html9.htm">移动文字|</a>
        <a href="html10.htm">多媒体</a><br>
        <a href="html5.htm">上一节</a> <a href="start.html">首页</a> <a href="html7.htm">下一节</a></p>
      </td>
  </tr>
</table>
</BODY>
</HTML>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -