工作流活动

上次更新日期 2026年3月3日

自定义数据网格中的列宽

本教程演示如何修改数据网格中最后一列的宽度。

先决条件：要按照本教程中的步骤操作，请创建数据表。确保表格最后一列的内容长度超过五到六个字。

在工作流中添加“构建数据表”活动。
打开“构建数据表”向导，并为表格添加所需的列。

备注：
确保列没有空格或特殊字符，因为您稍后将使用这些名称通过属性名称链接表单中的列。
将数据表保存到变量中。对于此示例，您可以将其命名为 dataTable。
在表单中添加一个数据网格，然后使用数据表变量的名称 ( dataTable ) 作为组件的属性名称。
根据数据表中的列及其值，将组件添加到数据网格中。这些组件的属性名称是数据表中列的确切名称。

对于此示例，请添加三个“文本字段”组件。使用组件的以下属性名称： column1 、 column2和column3 。
在表单的“属性”面板中，在“自定义 CSS”字段中输入以下代码：
```
.mygrid tbody>tr>:nth-child(1){ 
width: 25%;
}
.mygrid tbody>tr>:nth-child(2){ 
width: 15%;
}
.mygrid tbody>tr>:nth-child(3){ 
width: 60%;
}
.mygrid tbody>tr>:nth-child(1){ 
width: 25%;
}
.mygrid tbody>tr>:nth-child(2){ 
width: 15%;
}
.mygrid tbody>tr>:nth-child(3){ 
width: 60%;
}
```
备注：
nth-child元素表示网格组件中的列。
编辑“数据网格”组件。在“显示”选项卡的“自定义 CSS”下，输入mygrid CSS 类。保存组件和表单。这会导致第三列更宽，其中内容的长度超过大约五到六个字。

前一个自定义数据组件中的列宽

下一个在“编辑网格”中自定义列宽