KindEditor插件改用自定義圖標

關鍵代碼：

kindeditor目錄/themes/default/default.css

.ke-toolbar-icon-url {
 background-image: url(default.png);
}

也就是說插件所用圖片默認是

kindeditor目錄/themes/default/default.png

好比超級連接按鈕

.ke-icon-link {
 background-position: 0px -624px;
 width: 16px;
 height: 16px;
}

取消超級連接
.ke-icon-unlink {
 background-position: 0px -640px;
 width: 16px;
 height: 16px;
}

有一個background-position:的屬性，說明了圖片所在位置。

自定義的插件也受到默認圖標的影響。怎樣把本身的小圖標加進來呢？

首先把

default.css文件裏的

.ke-toolbar-icon-url {
 background-image: url(default.png);
}

註釋掉

/*

.ke-toolbar-icon-url {
 background-image: url(default.png);
}

*/

而後再把全部的.ke-icon-  的css裏面加上 background-image: url(default.png);
如：超連接的圖標

.ke-icon-link {

 background-image: url(default.png);
 background-position: 0px -624px;
 width: 16px;
 height: 16px;
}

記住要全部的都加上 background-image: url(default.png); 不然影響經常使用的圖標。
而後找到default.css裏面要使用自定義樣式的插件名，將原樣式位置刪除，引用的圖片改成本身想換的圖片

如：

.ke-icon-media {
   background-image: url(media.jpg);
   width: 16px;
   height: 16px;
}

就顯示本身的圖標了。下面是我作的效果