在 CKEditor 5 中，禁用时更改编辑器背景颜色？

Question

我正在使用 CKEditor 5 和 React 框架。禁用编辑器后如何设置编辑器背景为深灰色？

我正在使用此 CSS 在启用时将背景设置为白色：

.ck .ck-editor__main > .ck-editor__editable {
  background: #FFF;
}

但是，当 child div 有 .ck-read-only 但 :has() 没有浏览器支持时，我只想将背景颜色值更改为灰色。

.例如，这不起作用，因为浏览器尚不支持 :has()

.ck .ck-editor__main > .ck-editor__editable :has(> div.ck-read-only) {
  background: #C3C3C3;
}

组件的实现

                <CKEditor
                  disabled={true}
                  editor={Editor}
                  config={{
                    toolbar: [
                      'bold',
                      'italic',
                      'underline',
                      'bulletedList',
                      'numberedList',
                      'link',
                      '|',
                      'imageUpload'
                    ],
                    placeholder: 'Start writing your note'
                  }}
                  onReady={editor => {
                    console.log('Editor is ready to use!', editor);
                  }}
                  onChange={(event, editor) => {
                    const data = editor.getData();
                    console.log({ event, editor, data });
                  }}
                />

Answer 1

糟糕，我的选择器和类的附加位置有误。这允许我在禁用时设置背景颜色：

.ck .ck-editor__main > .ck-editor__editable.ck-read-only {
  background: #C3C3C3;
}

在 CKEditor 5 中，禁用时更改编辑器背景颜色？

In CKEditor 5 Change Editor Background Color when Disabled?

ckeditor

ckeditor5

ckeditor5-react