21

QuillJS を使用してカスタム フォント サイズをツールバーに追加するにはどうすればよいですか? 私は2つのアプローチを試しました：

// 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」も削除してみました。まだ何もありません。

4

3 に答える 3

5

今はちょっと変なので、これを Quill 構成に追加するかもしれません。しかし今のところ、それが機能しない理由は、Quill がサイズ設定のためにデフォルトでクラスを使用し、必要なのはインライン スタイルであるためです。これは次の方法で変更できます。

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

// Rest is the same
var editor = new Quill('#editor');
于 2016-07-28T17:17:49.137 に答える