跳到主要内容

样式定制

您可以通过应用特定样式来自定义编辑器组件的外观。

为编辑器容器定义 CSS 类​

<script>
   import { Editor } from "@svar-ui/svelte-editor";
</script>

<Editor css="myBox" />

此功能允许将 CSS 类分配给编辑器的主容器元素。css 属性可用于向编辑器容器应用自定义样式，使开发者能够根据应用程序的主题或布局调整其视觉设计。

在此示例中，myBox CSS 类应预先在样式表中定义。当编辑器需要与周围的 UI 元素保持一致，或具有特定的视觉特征（如特定的内边距、边框或背景色）时，此方法非常有用。

禁用字体​

如需禁用主题中使用的字体，可使用主题的 fonts 属性并将其设置为 false：

<script>
  import { Willow } from "@svar-ui/svelte-core";
  import { Editor } from "@svar-ui/svelte-editor";
</script>

<div style="width:300px">
  <Willow fonts={false}>
    <Editor />
  </Willow>
</div>
注意

请注意，如果您禁用了默认字体，则需要自行引入所需的字体。

相关文章： 视觉主题