initial commit

1 files changed, 223 insertions, 0 deletions

diff --git a/files/zh-cn/web/html/element/th/index.html b/files/zh-cn/web/html/element/th/index.html
new file mode 100644
index 0000000000..38aa571446
--- /dev/null
+++ b/files/zh-cn/web/html/element/th/index.html
@@ -0,0 +1,223 @@
+---
+title: <th>
+slug: Web/HTML/Element/th
+tags:
+  - HTML
+  - 标签
+  - 表格
+translation_of: Web/HTML/Element/th
+---
+<p><span class="seoSummary"><strong>HTML <code>&lt;th&gt;</code> 元素</strong></span>定义表格内的表头单元格。这部分特征是由<span class="seoSummary"> {{htmlattrxref("scope", "th")}} and {{htmlattrxref("headers", "th")}} 属性</span>准确定义的。</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">内容范畴</a></th>
+   <td>无</td>
+  </tr>
+  <tr>
+   <th scope="row">允许内容</th>
+   <td>
+    <div class="content-models">
+    <div id="table-mdls">流内容（除header、footer、sectioning content或heading content的继承。）</div>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">遗漏标签</th>
+   <td>开始标签是必需要的，而结束标签有时可以省略：当其后是{{HTMLElement("th")}} 或 {{HTMLElement("td")}} ，或者其后没有其他数据内容在其父元素内，。</td>
+  </tr>
+  <tr>
+   <th scope="row">允许的父级元素</th>
+   <td> {{HTMLElement("tr")}} 元素</td>
+  </tr>
+  <tr>
+   <th scope="row"><dfn>元素类型</dfn></th>
+   <td>任何</td>
+  </tr>
+  <tr>
+   <th scope="row">DOM接口</th>
+   <td>{{domxref("HTMLTableHeaderCellElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="属性">属性</h2>
+
+<p><span style="line-height: 21px;">该元素包含</span> <a href="/en-US/docs/Web/HTML/Global_attributes">全局属性</a></p>
+
+<dl>
+ <dt>{{htmlattrdef("abbr")}} {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>这个属性包含一个关于单元格内容的简单的介绍。一个用户代理（例如，语音阅读器）可能出现在描述之前。
+ <div class="note"><strong>使用提醒 : 不要使用这个属性，因为它已经在最新标准中过时。相对的，你可以把简短的描述放置于单元格内，把较长的描述内容放到title属性内。</strong></div>
+ </dd>
+ <dt>{{htmlattrdef("align")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>这个枚举属性指定单元格内容的水平对齐方式。可能的值有：
+ <ul>
+  <li><code>left</code>: 单元格内容左对齐</li>
+  <li><code>center</code>: 单元格内容居中</li>
+  <li><code>right</code>:  单元格内容右对齐</li>
+  <li><code>justify</code> (仅文字内容): 内容拉伸以覆盖单元格</li>
+  <li><code>char</code> (仅文字内容): 内容相对<code>&lt;th&gt;</code>标签中的某个字符对齐（默认值是页面语言的小数点字符）。该字符由{{htmlattrxref("char", "th")}} 和{{htmlattrxref("charoff", "th")}} 属性定义。</li>
+ </ul>
+
+ <p>对齐方式的默认值是 <code>left</code>.</p>
+
+ <div class="note"><strong>使用提示: 不要使用这个属性，因为它已经在最新标准中过时。</strong>
+
+ <ul>
+  <li> <code>left</code>, <code>center</code>, <code>right</code> 或 <code>justify</code> 这些对齐效果，应该使用CSS的{{cssxref("text-align")}} 来实现。</li>
+  <li> <code>char</code> 的对齐效果使用CSS的 {{cssxref("text-align")}} 实现， {{htmlattrxref("char", "th")}}亦同.  {{unimplemented_inline}} in CSS3.</li>
+ </ul>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("axis")}} {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>这个属性包含了一个空间分隔的字符串的列表.每个字符串是一组单元格的ID，而该表头适用于这个ID。
+ <div class="note"><strong>使用提示: 不要使用这个属性，因为它已经在最新标准中过时。应该使用</strong> {{htmlattrxref("scope", "th")}} 属性代替。</div>
+ </dd>
+ <dt>{{htmlattrdef("bgcolor")}} {{Non-standard_inline}}</dt>
+ <dd>这个属性定义了每列中每单元格的背景色。它由带有‘#’前缀的6位数的十六进制码组成，并在<a href="https://www.w3.org/Graphics/Color/sRGB">sRGB</a>中被定义。这个属性可能会用到十六个预定义的颜色字符串儿之一。
+ <table>
+  <tbody>
+   <tr>
+    <td style="background-color: black; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>black</code> = "#000000"</td>
+    <td style="background-color: green; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>green</code> = "#008000"</td>
+   </tr>
+   <tr>
+    <td style="background-color: silver; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>silver</code> = "#C0C0C0"</td>
+    <td style="background-color: lime; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>lime</code> = "#00FF00"</td>
+   </tr>
+   <tr>
+    <td style="background-color: gray; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>gray</code> = "#808080"</td>
+    <td style="background-color: olive; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>olive</code> = "#808000"</td>
+   </tr>
+   <tr>
+    <td style="background-color: white; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>white</code> = "#FFFFFF"</td>
+    <td style="background-color: yellow; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>yellow</code> = "#FFFF00"</td>
+   </tr>
+   <tr>
+    <td style="background-color: maroon; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>maroon</code> = "#800000"</td>
+    <td style="background-color: navy; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>navy</code> = "#000080"</td>
+   </tr>
+   <tr>
+    <td style="background-color: red; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>red</code> = "#FF0000"</td>
+    <td style="background-color: blue; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>blue</code> = "#0000FF"</td>
+   </tr>
+   <tr>
+    <td style="background-color: purple; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>purple</code> = "#800080"</td>
+    <td style="background-color: teal; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>teal</code> = "#008080"</td>
+   </tr>
+   <tr>
+    <td style="background-color: fuchsia; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>fuchsia</code> = "#FF00FF"</td>
+    <td style="background-color: aqua; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>aqua</code> = "#00FFFF"</td>
+   </tr>
+  </tbody>
+ </table>
+
+ <div class="note"><strong>使用提示: </strong>不要使用这个属性，它不是标准属性且仅在某些版本的Microsoft Internet Explorer支持:  {{HTMLElement("th")}} 元素应当用<a href="/en-US/docs/CSS">CSS</a>来样式化. 为了创造出同样的效果只需要使用<a href="/en-US/docs/CSS">CSS</a>中的{{cssxref("background-color")}}属性就可以啦。</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("char")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>列中的内容与<code>&lt;th&gt;</code> 元素中的字母对齐。通常其值包含一个(.)来排列数字或者货币值。 如果 {{htmlattrxref("align", "th")}}没有被设置为<code>char</code>，这个属性就会被忽略。
+ <div class="note"><strong>使用提示: </strong>不要使用这个属性，因为它已经在最新标准中过时。为了达到同样的效果， 你可以指定该字母为{{cssxref("text-align")}} 属性中的第一个值,或通过CSS3中的{{unimplemented_inline}}。</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("charoff")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>这个属性用来将列数据移到<strong>char</strong>属性指定字母的右边。 其值指定了移动的长度。
+ <div class="note"><strong>使用提示: </strong>不要使用这个属性，因为它已经在最新标准中过时。</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("colspan")}}</dt>
+ <dd>这个属性包含一个正整数表示了每单元格中扩展列的数量。默认值为<code>1</code> 。超过1000的值被视作1000。</dd>
+ <dt>{{htmlattrdef("headers")}}</dt>
+ <dd>这个属性包含了一个空间分隔的字符串的列表, 每个与其他{{HTMLElement("th")}}元素相关联的<code>id</code> 属性一一对应。</dd>
+ <dt>{{htmlattrdef("rowspan")}}</dt>
+ <dd>这个属性包含一个正整数表示了每单元格中扩展列的数量。默认值为<code>1.</code> 如果该值被设置为 <code>0</code>, 这个单元格就被扩展为({{HTMLElement("thead")}}，{{HTMLElement("tbody")}} 或{{HTMLElement("tfoot")}})中表格部分的最后一个元素。比65534大的值被视作65534。</dd>
+ <dt>{{htmlattrdef("scope")}}</dt>
+ <dd>这个枚举属性定义了表头元素 <sup>(在{{HTMLElement("th")}}中定义) </sup>关联的单元格。它可能有以下值：
+ <ul>
+  <li><code>row</code>:  表头关联一行中所有的单元格。</li>
+  <li><code>col</code>: 表头关联一列中所有的单元格。</li>
+  <li><code>rowgroup</code>:表头属于一个行组并与其中所有单元格相关联。这些单元格可以被放在表头的左侧或右侧，取决于 {{HTMLElement("table")}} 元素中 <code><a href="/en-US/docs/Web/HTML/Global_attributes/dir">dir</a></code> 属性的值 。</li>
+  <li><code>colgroup</code>: 表头属于一个列组并与其中所有单元格相关联。</li>
+  <li><code>auto</code></li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("valign")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>这个属性指定了单元格内文本的垂直对齐方式。这个属性可能有以下值:
+ <ul>
+  <li><code>baseline</code>: 将文本置于单元格底部并将其与字母的<a href="https://en.wikipedia.org/wiki/Baseline_%28typography%29">baseline</a>对齐而不是与底部。若字母没有baseline以下的部分（即为无<a href="https://www.wikiwand.com/zh/%E9%99%8D%E9%83%A8">降部</a>）那么baseline值起到的效果便和<code>bottom相同。</code></li>
+  <li><code>bottom</code>: 将文本置于底部。</li>
+  <li><code>middle</code>: 将文本置于单元格中央。</li>
+  <li><code>top</code>: 将文本置于单元格顶部。</li>
+ </ul>
+
+ <div class="note"><strong>使用提示：</strong>不要使用这个属性，因为它已经在最新标准中过时。使用CSS {{cssxref("vertical-align")}}特性代替。</div>
+ </dd>
+ <dt>{{htmlattrdef("width")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}</dt>
+ <dd>这个属性用来定义一个期望的单元格宽。额外的空间可以藉由<a href="/en-US/docs/Web/API/HTMLTableElement/cellSpacing">cellspacing</a>和 <a href="/en-US/docs/Web/API/HTMLTableElement/cellPadding">cellpadding</a> 属性来增加，并且{{HTMLElement("col")}}元素的宽也可以创造额外空间。但是，如果一列宽太窄以至于无法恰当显示 某单元格时，它会被自动加宽。
+ <div class="note"><strong>使用提示：</strong>不要使用这个属性，因为它已经在最新标准中过时。使用CSS {{cssxref("width")}}属性代替。</div>
+ </dd>
+</dl>
+
+<h2 id="示例">示例</h2>
+
+<p>参考 {{HTMLElement("table")}} 中 <code>&lt;th&gt;</code>的示例内容。</p>
+
+<h2 id="规范">规范</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">规范</th>
+   <th scope="col">状态</th>
+   <th scope="col">备注</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG','tables.html#the-th-element','th element')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C','tabular-data.html#the-th-element','th element')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+
+
+<p>{{Compat("html.elements.th")}}</p>
+
+<h2 id="参阅">参阅</h2>
+
+<ul>
+ <li>Other table-related HTML Elements: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}}.</li>
+</ul>
+
+<p>{{HTMLRef}}</p>