CkEditor - Custom CSS自定義樣式

CkEditor是目前世界上最多人用的富文本編輯器。遇上客戶提需求，要改一下編輯器的樣式，那就是深入CkEditor的底層來修改源碼。

修改完的樣式是這樣，黑邊，藍底，迷之美學。這就是男人自信的表現，風迷萬千。

 

1. 下載了CKEDITOR，解壓縮，里面是這樣。

注意，CkEditor的css樣式是在skins/moono-lisa/editor.css這個。如果想自定義樣式，就在這修改。

2. 動手修改樣式

邊框顏色：

.cke_chrome {
    border: 1px solid #111111;
}

背景顏色：

<script type="text/javascript">
    CKEDITOR.replace("context");
    CKEDITOR.addCss(".cke_editable{background-color: #4cffea}");
</script>

TopBar底邊樣式：

.cke_top {
    border-bottom: 1px solid #111111;
}

 

3. icon

在skins/moono-lisa/icons_hidpi.png里修改icon。

我把碳黑色icon全部轉成了純黑色icon。