如何将自定义字体大小添加到QuillJS编辑器 [英] How to add custom font sizes to QuillJS editor

问题描述

如何使用QuillJS将自定义字体大小添加到工具栏?我尝试了两种方法:

How do you add custom font sizes to the toolbar with QuillJS? I've tried two approaches:

// Initiate the editor
        let toolbarOptions = [
            ['bold', 'italic', 'underline', 'strike'],
            [{ 'align': [] }],
            [{ 'size': ['10px', '20px', '80px'] }],
            [{ 'color': ['#FFF'] }]
        ];
        this.editor = new Quill('#executive-control-editor', {
            modules: {
                toolbar: toolbarOptions
            },
            theme: 'snow'
        });

和

<div id="toolbar">
        <span class="ql-formats">
            <button class="ql-bold"></button>
            <button class="ql-italic"></button>
            <button class="ql-underline"></button>
            <button class="ql-strike"></button>
        </span>
        <span class="ql-formats">
            <select class="ql-align"></select>
        </span>
        <span class="ql-format-group">
          <select title="Size" class="ql-size">
            <option value="10px">Small</option>
            <option value="13px">Normal</option>
            <option value="18px">Large</option>
            <option value="32px">Huge</option>
          </select>
        </span>
        <span class="ql-formats">
            <button class="ql-image"></button>
        </span>
    </div>

但是它们都不起作用.这里有我想念的东西吗?我也尝试过从值中删除"px" ；还是一无所有.

However neither of them work. Is there something I'm missing here? I've tried removing the "px" from the value as well; still nothing.

推荐答案

现在有点奇怪，因此我可以将其添加到Quill配置中.但是现在，它不起作用的原因是Quill默认使用类来调整大小，而您想要的是内联样式.您可以使用以下方法进行更改:

It's a bit weird right now so I may add this into a Quill configuration. But for now, the reason it's not working is Quill uses classes by default for sizing and what you want is inline styles. You can change this with:

var Size = Quill.import('attributors/style/size');
Quill.register(Size, true);

// Rest is the same
var editor = new Quill('#editor');

这篇关于如何将自定义字体大小添加到QuillJS编辑器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！