Buildfire应用调整字体、按钮尺寸的CSS修改位置及自定义组件获取问询

Custom Widget 获取渠道 #

• 直接登录你的Buildfire应用控制面板，进入插件市场，搜索「Custom Widget」即可直接安装使用，无需额外从第三方渠道获取。
• 安装完成后添加到对应应用页面，即可直接使用内置的HTML、CSS、JavaScript编辑面板，修改后支持实时预览效果。
• 你可以直接在Custom Widget的CSS编辑栏中编写覆盖样式，自定义样式优先级高于「free text questionnaire」的默认样式，无需修改原插件代码即可生效。

无需Custom Widget的SDK修改方案 #

如果你选择直接通过下载的Buildfire JS插件SDK修改样式，不需要调整SDK内置的基础CSS文件，直接修改插件目录下的css/widget.css文件即可，该文件是专门用于存放开发者自定义样式的，修改内容不会被SDK基础配置覆盖。

对应需求的CSS参考示例 #

你可以根据你的实际需求调整以下CSS代码，写入Custom Widget的CSS面板或者上述widget.css文件中即可生效：

/* 调整问题文本字体大小与列宽 */
.questionnaire-question-title {
  font-size: 14px !important; /* 按需求调整数值 */
  width: 75% !important; /* 按需求调整列宽比例 */
}
/* 缩小答题按钮、上下页跳转按钮尺寸 */
.questionnaire-submit-btn, .questionnaire-pagination-btn {
  padding: 4px 10px !important;
  font-size: 12px !important;
  height: auto !important;
}

提示：如果上述类名不匹配，你可以通过浏览器开发者工具选中目标元素，获取准确的CSS选择器后替换即可，添加!important是为了覆盖插件原有默认样式优先级。

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