关于Workshop模块能否修改字体类型及添加新字体族的问询

能否修改字体类型？ #

可以，有两种通用实现方式：

1. 模块内置配置（优先尝试）
   不少Workshop模块的「外观/样式设置」面板会提供字体选择下拉框，直接选择目标字体即可完成修改，无需代码操作。

2. 自定义CSS覆盖（通用方案）
   如果模块无内置字体设置，通过自定义CSS强制覆盖是最可靠的方法：
   找到模块或目标元素的CSS选择器（浏览器F12开发者工具可查看），添加字体规则：

   /* 示例：给整个Workshop模块设置字体 */
   .workshop-container {
     font-family: "Arial", "Microsoft Yahei", sans-serif;
   }
   

能否为多个Widget/模块添加独立字体族？ #

完全可以，核心是为不同Widget绑定独立字体族，步骤如下：

1. 引入自定义字体族

先将你的字体文件（推荐woff2/woff格式）上传到项目静态资源目录，然后在全局或模块专属CSS中声明字体：

@font-face {
  font-family: "MyCustomFont";
  src: url("/static/fonts/MyCustomFont-Regular.woff2") format("woff2"),
       url("/static/fonts/MyCustomFont-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "AnotherCustomFont";
  src: url("/static/fonts/AnotherCustomFont-Bold.woff2") format("woff2");
  font-weight: bold;
  font-style: normal;
}

2. 为不同Widget单独应用字体

通过每个Widget的专属CSS选择器，分别指定字体族：

/* 给Workshop内的表格Widget用自定义字体 */
.workshop-module .widget-table {
  font-family: "MyCustomFont", sans-serif;
}

/* 给Workshop内的卡片Widget用另一种自定义字体 */
.workshop-module .widget-card {
  font-family: "AnotherCustomFont", serif;
}

注意事项 #

• 确保字体文件路径正确，避免加载失败；
• 优先使用woff2格式，兼顾兼容性与加载速度；
• 若在低代码平台使用Workshop模块，需在平台提供的「自定义CSS」入口或模块的「样式属性」中添加上述代码。

内容的提问来源于stack exchange，提问作者Snowman