如何在Summernote中设置字体大小？

Question

我一直使用summernote作为我的默认文本编辑器，但是在初始化时我无法设置特定的默认字体大小。

到目前为止，我已经尝试过：

$('.active-textcontainer').summernote({
        toolbar: [
            ['style', ['bold', 'italic', 'underline']],
            ['fontsize', ['fontsize']],
            ['color', ['color']],
            ['para', ['ul', 'ol', 'paragraph']]
        ],
         height:150,
         fontsize:'18px'
    });

"and"。

$('.active-textcontainer').summernote({
        toolbar: [
            ['style', ['bold', 'italic', 'underline']],
            ['fontsize', ['fontsize']],
            ['color', ['color']],
            ['para', ['ul', 'ol', 'paragraph']]
        ],
         height:150,
         fontsize:'18'
    });

任何帮助将不胜感激。

- Bazinga777

---

尝试使用大写字母S的fontSize？ - user663031

@torzaburo，起初我也尝试了fontSize:'18px'、fontSize:18、font-size等方式，但都没有成功。后来我查看了summernote，发现一个简单的方法就是使用$('.note-editable').css('font-size','18px');，我在回答中进行了解释。 - albciff

Answer 1

我从未使用过summernote，不过查看API后发现（至少目前）没有什么可以指定默认字体大小的选项，我进行了一些尝试，似乎都不起作用。

一个可能的解决方案是直接使用jQuery将font-size样式应用于编辑器div，因为当你在一个对象中初始化summernote时，它总是创建以下格式的div：<div class="note-editable" ...>...</div>。所以，在初始化之后，您可以在代码中执行以下操作：$('.note-editable').css('font-size','18px');，示例：

$('.active-textcontainer').summernote({
    toolbar: [
        ['style', ['bold', 'italic', 'underline']],
        ['fontsize', ['fontsize']],
        ['color', ['color']],
        ['para', ['ul', 'ol', 'paragraph']]
    ],
     height:150
});

$('.note-editable').css('font-size','18px');

这个解决方案有点棘手，如果下一个版本中

编辑器的类名更改，它将无效，但也许对于您的情况来说足够了。

希望这能帮到您，

- albciff

---

我考虑了一下，如果没有其他选择，我就会使用这个。谢谢，只是想确认是否有其他选项可以做到这一点。 - Bazinga777

我以前从未使用过 summernote，所以我不确定是否有其他方法可以做到这一点，但是我按照我的答案查看了API，我没有看到其他选项。在你找到另一种方法之前，你可以使用这个选项 :)。 - albciff

Answer 2

或者通过CSS设置默认值。

.note-editor .note-editable {
    line-height: 1.2;
    font-size: 18px;
}

- PowPi

Answer 3

你可以设置当前选中文本的字体大小。

$('.summernote').summernote('fontSize', 40);

但似乎没有API可以选择文本。

无法设置默认字体大小非常奇怪，因此我在他们的repo中提出了问题。

- Dan Dascalescu