表单样式

通用表单看起来就像通用表单。访客会注意到联系表单是否与网站其他部分风格不符——这会损害信任感。

自动表单生成器让您可以完全控制表单样式。匹配您的品牌颜色,使用您的字体,调整间距,并设计出看起来像是您网站自然组成部分的表单。

为什么表单样式很重要

您的网站有自己的品牌,您的表单也应该体现这一点。
当表单的外观与网站其他部分不符时,访客会犹豫不决。他们会怀疑自己是否还在同一个网站上。这种犹豫会降低转化率。
设计精美的表单也能体现专业性。一份完善的表单会告诉访客您注重细节——如果您重视表单设计,那么您很可能也重视他们的数据。

表单样式的工作原理

自动表单生成器在表单生成器界面中内置了可视化样式编辑器。

  • 选择要搭配的款式您可以从表单容器、字段标签、输入字段、按钮或错误消息中进行选择。
  • 调整设置使用颜色选择器、滑块和下拉菜单来更改数值。无需学习或记忆任何 CSS 语法。
  • 立即预览所有更改都会立即显示在实时预览中。发布前,您可以准确查看表单的最终效果。
  • 保存为默认值自动将样式应用到新表单。一次创建,处处复用。

您可以自定义的内容

颜色

颜色

掌控表单中的所有颜色。设置表单容器和各个字段的背景色。设置标签、占位符和输入文本的文本颜色。设置默认、聚焦和错误状态的边框颜色。设置按钮的背景色、文本颜色和悬停效果颜色。

活版印刷

活版印刷

选择标签和输入框的字体。可以独立调整字体大小——标签字体越大,强调信息越醒目;辅助文本字体越小,提示信息越次要。还可以控制字体粗细,标签字体加粗,输入文本字体减细。

间距和布局

间距和布局

设置字段间距,留出更多空间。调整字段内部的内边距,方便舒适地输入文本。控制表单四周的边距,使其完美地融入页面布局。

边界和角落

边界和角落

定义边框宽度、样式和颜色。圆角设计更显现代感,锐角设计更显简约。为表单的不同状态应用不同的边框样式——默认使用低调边框,聚焦时使用醒目边框。

钮扣

钮扣

设计符合品牌形象的提交按钮。可自定义背景颜色、文字颜色、边框圆角、内边距、字体大小和字体粗细。自定义悬停和激活状态,使按钮响应灵敏且易于点击。

窗体容器

窗体容器

设置表单容器的整体样式。添加背景颜色或保持透明。应用阴影效果以增加层次感。设置圆角边框半径,使表单容器呈现圆形。控制最大宽度,防止表单拉伸过宽。

常见表单样式场景

符合品牌指南

贵公司有特定的颜色——主色为 #0F2D5F,强调色为 #F59E0B。请在样式编辑器中输入这些值。表单按钮使用强调色,表单标签使用主色。完美保持一致的品牌形象。

创建高对比度表单

网站背景较深?那就创建醒目的浅色表单。背景较浅?那就使用带边框和柔和阴影的表单,既能界定表单区域,又不会喧宾夺主。

极简主义设计

移除边框,减少间距,使用透明背景。创建与页面融为一体的表单,而不是将其置于一个单独的方框中。

构建醒目的行动号召表单

大按钮、醒目的颜色、充足的留白。为最重要的潜在客户开发页面创建引人注目的表单。

适用于任何主题的表单

自动表单生成器兼容所有 WordPress 主题。您创建的表单样式能够适应任何设计风格。

无论您使用 Woodmart、Astra、GeneratePress、Divi 还是其他任何主题,您的表单都将呈现原生外观。样式编辑器提供足够的控制选项,让您轻松匹配任何设计系统。

没有主题冲突,没有样式继承问题,表单外观完全符合您的预期。

表单样式

无需 CSS

您无需编写自定义 CSS 来设置表单样式。可视化编辑器会自动处理一切。

但如果您需要 CSS 控制,自动表单生成器支持每个表单自定义 CSS。您可以为特殊情况添加覆盖,或应用可视化编辑器中不可用的高级样式。高级用户可以获得所需的灵活性。

立即开始构建 WordPress 表单

立即免费下载自动表单生成器,创建无限表单。无需信用卡,无试用期限制。更便捷的表单创建方式。