使用 Quill 时更改工具栏按钮的颜色?

Mig*_*olo 2 javascript css quill

当前工具栏

上面我链接了工具栏当前外观的图像。我正在尝试将按钮的颜色和下拉列表中的文本设为白色。

var toolbarOptions = [
        [{ 'header': [1, 2, 3, false] }],
        ['bold', 'italic', 'underline', 'strike'],
        ['blockquote'],
        [{ 'align': ['', 'center', 'justify'] }],
        [{ 'list': 'ordered'}, { 'list': 'bullet' }],
        [{ 'script': 'sub'}, { 'script': 'super' }]                  
    ];

    var quill = new Quill('#editor', {
        modules: { toolbar: toolbarOptions },
        theme: 'snow'
    });
Run Code Online (Sandbox Code Playgroud)

Dan*_*nko 11

也许按钮和下拉样式可以用 js 自定义,但在文档中找不到。但是,css 仍然是一种选择——如果这对你有用:

.ql-toolbar .ql-stroke {
    fill: none;
    stroke: #fff;
}

.ql-toolbar .ql-fill {
    fill: #fff;
    stroke: none;
}

.ql-toolbar .ql-picker {
    color: #fff;
}
Run Code Online (Sandbox Code Playgroud)

  • 我尝试将其实现到我的 CSS 文件中,但它仍然不起作用。 (3认同)
  • 尝试将其添加到所有 css 的末尾,甚至可能添加到单独的 `<style>` 元素中 - 只是为了测试这些样式是否被覆盖。仅出于测试目的,请尝试在所有值后添加 `!important` 并让我知道是否有任何进展。我昨天测试了这些样式,它对我有用。 (2认同)
  • 你,我的朋友,是英雄!谢谢! (2认同)