将开发者工具与表单一起使用

您可以使用开发者工具试验表单外观或布局。 每当运行表单时，如果右键单击该表单，然后选择“ 检查”，则会打开开发工具。 本教程演示如何在开发者工具中试验 CSS 样式。 此示例演示如何更改数据网格中所有 文本字段 标题的颜色。

注意： 您在开发者工具中应用的更改是临时的。 如果要将其永久应用于表单，则必须在表单的“自定义 CSS ”属性字段中输入自定义 CSS 代码，然后使用“自定义 CSS 类”属性将其应用于要设置样式的每个组件，组件。

1. 运行包含 数据网格 的表单，其中包含 文本字段 组件。
2. 在表单内右键单击，然后选择“ 检查”。
3. 要专注于要应用 CSS 样式的确切元素，请选择 ，或按 Ctrl + Shift + C。 现在，您可以选择“ 文本字段 ”组件的标题。
4. 在开发者工具的 “样式” 部分中，您可以看到各种 CSS 类。 对于此示例，找到 .table 类并将 color 属性更改为 violet。
   
   

   

   
   
5. 现在，我们将此颜色永久应用于数据网格。 在表单的 属性 面板中，在 自定义 CSS 字段中输入以下 CSS 类：

   .color-change {
       color: violet
       }

6. 编辑表单中的“ 文本字段 ”，然后转到“ 显示” 选项卡。
7. 在“ 自定义 CSS 类 ”中，输入您在步骤 5 中添加的自定义 CSS 类。
   
   

   

   
   
   保存组件并查看结果。