[zh-cn]: create docs for HTMLTableCellElement (#23798)

Co-authored-by: A1lo <[email protected]>

files/zh-cn/web/api/htmltablecellelement/abbr/index.md

@@ -0,0 +1,89 @@
+---
+title: HTMLTableCellElement：abbr 属性
+slug: Web/API/HTMLTableCellElement/abbr
+l10n:
+  sourceCommit: 4dec42ed700040565e8af0e14ff104054ebc20f5
+---
+
+{{ APIRef("HTML DOM") }}
+
+{{domxref("HTMLTableCellElement")}} 接口的 **`abbr`** 属性指示与单元格相关联的缩写。如果单元格不是表头单元格 {{HTMLElement("th")}}，则忽略该属性。
+
+它反映 {{HTMLElement("th")}} 元素的 `abbr` 属性。
+
+> [!NOTE]
+> 此属性在浏览器中不具有视觉效果。它添加信息以帮助辅助技术（像屏幕阅读器）能够使用这个缩写。
+
+## 值
+
+一个字符串。
+
+## 示例
+
+此示例将每个第一单元格的行表头相关联的缩写添加为前缀。
+
+### HTML
+
+```html
+<table>
+  <thead>
+    <tr>
+      <th abbr="Maker">制造商</th>
+      <th abbr="Model">汽车型号</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>特斯拉</td>
+      <td>3</td>
+    </tr>
+    <tr>
+      <td>比亚迪</td>
+      <td>海豚</td>
+    </tr>
+    <tr>
+      <td>大众</td>
+      <td>ID.3</td>
+    </tr>
+  </tbody>
+</table>
+```
+
+```css hidden
+table {
+  border-collapse: collapse;
+}
+
+th,
+td,
+table {
+  border: 1px solid black;
+}
+
+button {
+  margin: 1em 1em 1em 0;
+}
+```
+
+### JavaScript
+
+```js
+const rows = document.querySelectorAll("thead tr");
+const cells = rows[0].cells;
+
+for (const cell of cells) {
+  cell.textContent = `${cell.textContent}（${cell.abbr}）`;
+}
+```
+
+### 结果
+
+{{EmbedLiveSample("示例", "100%", 220)}}
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}

files/zh-cn/web/api/htmltablecellelement/align/index.md

@@ -0,0 +1,41 @@
+---
+title: HTMLTableCellElement：align 属性
+slug: Web/API/HTMLTableCellElement/align
+l10n:
+  sourceCommit: d16706e4e930c57161d473287374a9286c663147
+---
+
+{{APIRef("HTML DOM")}}{{deprecated_header}}
+
+{{domxref("HTMLTableCellElement")}} 接口的 **`align`** 属性是一个指示如何在 {{htmlelement("th")}} 或 {{htmlelement("td")}} 表格单元格水平对齐文本的字符串。
+
+> [!NOTE]
+> 此属性已弃用，应使用 CSS 在单元格中水平对齐文本。使用 CSS {{cssxref("text-align")}} 属性，其用于水平对齐单元格中文本，且优先级更高。
+
+## 值
+
+可能的值：
+
+- `left`
+  - : 将文本向左对齐。使用 `text-align: left` 代替。
+- `right`
+  - : 将文本向右对齐。使用 `text-align: right` 代替。
+- `center`
+  - : 将文本居中对齐。使用 `text-align: center` 代替。
+
+## 示例
+
+使用 CSS `text-align` 替代，{{cssxref("text-align")}} 页面有一个[示例](/zh-CN/docs/Web/CSS/text-align#表格对齐)。
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{cssxref("text-align")}}
+- [样式化表格](/zh-CN/docs/Learn/CSS/Building_blocks/Styling_tables)

files/zh-cn/web/api/htmltablecellelement/bgcolor/index.md

@@ -0,0 +1,39 @@
+---
+title: HTMLTableCellElement：bgColor 属性
+slug: Web/API/HTMLTableCellElement/bgColor
+l10n:
+  sourceCommit: 245715b48674c1729cb63417e4a27628e30ae28c
+---
+
+{{APIRef("HTML DOM")}}{{deprecated_header}}
+
+**`HTMLTableCellElement.bgColor`** 属性用于设置单元格的背景色或者检索已弃用的 [`bgColor`](/zh-CN/docs/Web/HTML/Element/td#bgcolor) 属性的值（如果存在）。
+
+> [!NOTE]
+> 此属性已弃用，且应使用 CSS 设置背景色。使用 {{cssxref("background-color")}} 属性代替。
+
+## 值
+
+可以使用以下值类型之一：
+
+- 命名的颜色，像 `red` 或 `blue`
+- 十六进制代码，像 `#0000dd` 或 `#00d`
+
+> [!NOTE]
+> 这里接受的值是 CSS 颜色值的子集。仅限 {{cssxref("named-color")}} 和 3 位 或 6 位 {{cssxref("hex-color")}}（没有 alpha 通道）。虽然所有 HTML 颜色值在 CSS 中都是有效的，但在另一个方向上并非如此。
+
+## 示例
+
+使用 CSS `background-color` 代替。在 {{cssxref("background-color")}} 页面有个[带有 HTML 表格元素的 `background-color`](/zh-CN/docs/Web/CSS/background-color#着色表) 可用。
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{domxref("HTMLTableRowElement.bgColor")}}

files/zh-cn/web/api/htmltablecellelement/cellindex/index.md

@@ -0,0 +1,80 @@
+---
+title: HTMLTableCellElement：cellIndex 属性
+slug: Web/API/HTMLTableCellElement/cellIndex
+l10n:
+  sourceCommit: 3466b077e26ce0293b7b95cba0bd05559c3a3194
+---
+
+{{ APIRef("HTML DOM") }}
+
+{{domxref("HTMLTableCellElement")}} 接口的 **`cellIndex`** 只读属性表示单元格在其所在行（{{htmlelement("tr")}}）中的位置。第一个单元格的索引是 `0`。
+
+## 值
+
+返回单元格的索引，或如果单元格不属于任何行，则返回 `-1`。
+
+## 示例
+
+此示例为 `tbody` 中第一行的所有单元格编号添加标签。
+
+### HTML
+
+```html
+<table>
+  <thead>
+    <tr>
+      <th>商品</th>
+      <th>价格</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>香蕉</td>
+      <td>$2</td>
+    </tr>
+    <tr>
+      <td>大米</td>
+      <td>$2.5</td>
+    </tr>
+  </tbody>
+</table>
+```
+
+```css hidden
+table {
+  border-collapse: collapse;
+}
+
+th,
+td,
+table {
+  border: 1px solid black;
+}
+
+button {
+  margin: 1em 1em 1em 0;
+}
+```
+
+### JavaScript
+
+```js
+const rows = document.querySelectorAll("tbody tr");
+const cells = rows[0].cells;
+
+for (const cell of cells) {
+  cell.textContent = `${cell.textContent}（单元格 #${cell.cellIndex}）`;
+}
+```
+
+### 结果
+
+{{EmbedLiveSample("示例")}}
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}

files/zh-cn/web/api/htmltablecellelement/ch/index.md

@@ -0,0 +1,31 @@
+---
+title: HTMLTableCellElement：ch 属性
+slug: Web/API/HTMLTableCellElement/ch
+l10n:
+  sourceCommit: d16706e4e930c57161d473287374a9286c663147
+---
+
+{{APIRef("HTML DOM")}}{{deprecated_header}}
+
+{{domxref("HTMLTableCellElement")}} 接口的 **`ch`** 属性什么都不做，它反映单元格元素的 `char` 属性。
+
+> [!NOTE]
+> 此属性旨在支持将表格单元格内容对齐到特定字符（通常是小数点），但浏览器从未实现过。
+>
+> 要实现这种对齐，请注意 {{cssxref("text-align")}} CSS 属性对字符串值的支持。
+
+## 值
+
+单个字符。
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{cssxref("text-align")}}

files/zh-cn/web/api/htmltablecellelement/choff/index.md

@@ -0,0 +1,31 @@
+---
+title: HTMLTableCellElement：chOff 属性
+slug: Web/API/HTMLTableCellElement/chOff
+l10n:
+  sourceCommit: d16706e4e930c57161d473287374a9286c663147
+---
+
+{{APIRef("HTML DOM")}}{{deprecated_header}}
+
+{{domxref("HTMLTableCellElement")}} 接口的 **`chOff`** 属性什么都不做，它反映单元格元素的 `charoff` 属性。
+
+> [!NOTE]
+> 此属性旨在支持将表格单元格内容对齐到特定字符（通常是小数点），但浏览器从未实现过。
+>
+> 要实现这种对齐，请注意 {{cssxref("text-align")}} CSS 属性对字符串值的支持。
+
+## 值
+
+一个数字。
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{cssxref("text-align")}}