Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: descriptions support table-layout #1809

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions docs/web/api/descriptions.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,19 @@ spline: layout

{{ column }}

### Table Layout

Sets the algorithm used to layout `table` cells, rows, and columns, exactly the same as the native table-layout css property. For more details, see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout)。`fixed` by default.

- `fixed`: In the fixed table layout algorithm, the width of each column is determined as follows:
- A column element with explicit width sets the width for that column.
- Otherwise, a cell in the first row with explicit width determines the width for that column.
- Otherwise, the column gets the width from the shared remaining horizontal space.

- `auto`: The automatic table layout algorithm is used. The widths of the table and its cells are adjusted to fit the content.

{{ table-layout }}

### Custom Style

{{ custom-style }}
Expand Down
13 changes: 13 additions & 0 deletions docs/web/api/descriptions.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,19 @@ spline: layout

{{ column }}

### Table Layout

用于设置底层 `table` 单元格、行和列的布局算法,与原生 table-layout css 属性完全一致。详情可参考 [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout)。默认为 `fixed`:

- `fixed`: 使用固定表格布局算法。此模式下,每列的宽度按以下方式确定:
- 使用显示设定的列宽度
- 否则,使用第一行中显示设定的的单元格宽度作为对应列的宽度
- 否则,均分剩余宽度

- `auto`: 使用自动表格布局算法。表格及其单元格的宽度会根据内容进行调整。

{{ table-layout }}

### 自定义样式

{{ custom-style }}
Expand Down
4 changes: 4 additions & 0 deletions style/web/components/descriptions/_index.less
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,10 @@
color: @text-color-placeholder;
}

&--fixed {
table-layout: fixed;
}

&--border {
> tbody {
> tr {
Expand Down
Loading