如何在CKEditor 5配置中为占位符添加换行符?
在CKEditor 5中实现多行占位符
要给CKEditor 5的占位符添加换行,直接在配置里写<br>或原生换行符默认不会生效——因为编辑器的占位符样式默认不支持多行渲染,需要通过配置文本换行符+自定义CSS的组合方式实现:
配置占位符文本时使用换行符
\n
在编辑器初始化配置中,用\n标记换行位置:ClassicEditor .create( document.querySelector( '#editor' ), { placeholder: 'Type some\ncontent here!' } ) .catch( error => { console.error( error ); } );添加自定义CSS让占位符支持多行
编辑器默认的占位符样式会忽略换行,需要通过CSS开启多行渲染:/* 适配所有编辑器类型(inline和classic) */ .ck.ck-editor__editable::placeholder { white-space: pre-line; line-height: 1.6; /* 可选,优化行间距 */ }
完成以上两步后,占位符里的\n会被解析为换行,"content here!"就会显示在"Type some"下方。
内容的提问来源于stack exchange,提问作者Fabien
相关产品推荐
相关产品推荐

