在 CKEditor 中为图像提供默认类

CKEditor 可以通过添加自定义 CSS 类来为图像提供默认类。这使得您能够为您的网站的所有图像添加默认样式，无需每次使用 CKEditor 时手动添加样式。

以下是实现此功能的步骤：

1. 打开 CKEditor 配置文件，并在 config.js 文件中添加以下代码：

CKEDITOR.on("instanceReady", function(event) {
    event.editor.dataProcessor.htmlFilter.addRules({
        elements: {
            $: function(element) {
                if (element.name === "img") {
                    var classes = element.attribs.class
                    if (!classes) {
                        classes = "my-default-class";
                    } else {
                        classes += " my-default-class";
                    }
                    element.attribs.class = classes;
                }
                return element;
            }
        }
    });
});

2. 这段代码将在每次 CKEditor 实例准备就绪时运行，并将为所有插入的图像添加一个名为 my-default-class 的 CSS 类。

3. 您可以将此类添加到您的 CSS 样式表中，并将其用于您的所有图像。

.my-default-class {
    max-width: 100%;
    height: auto;
}

这个样式类将使每个图像的宽度自适应其容器的大小，并保持图像的高度比例。

您还可以为 my-default-class 选择其他样式，以便更好地适应您的站点。

这就是在 CKEditor 中为图像提供默认类的方法。

注意： 请确保您已安装 CKEditor，并且已正确加载了 CKEditor 的 config.js 文件，否则以上代码可能无法生效。