为了对CKEDITOR编辑控件有更多的了解，简单抓取了其产生的页面中定义的CSS。主要想看看如何更好的对其更改样式，从而做到真正的WYSWYG。
抓取的这部分可以分为三大块：
CKEDITOR可编辑区对应的CSS：
.cke_editable{cursor:text}
.cke_editable img,.cke_editable input,.cke_editable textarea{cursor:default}
CKEDITOR命令菜单对应的CSS。
img.cke_flash{background-image: url(http://localhost/public/js/fullckeditor/plugins/flash/images/placeholder.png?t=D8AD);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 80px;height: 80px;}
.cke_editable form{border: 1px dotted #FF0000;padding: 2px;}
img.cke_hidden{background-image: url(http://localhost/public/js/fullckeditor/plugins/forms/images/hiddenfield.gif?t=D8AD);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 16px !important;height: 16px !important;}
img.cke_iframe{background-image: url(http://localhost/public/js/fullckeditor/plugins/iframe/images/placeholder.png?t=D8AD);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 80px;height: 80px;}
.cke_contents_ltr a.cke_anchor,
.cke_contents_ltr a.cke_anchor_empty,
.cke_editable.cke_contents_ltr a[name],
.cke_editable.cke_contents_ltr a[data-cke-saved-name]{
background:url(http://localhost/public/js/fullckeditor/plugins/link/images/anchor.png?t=D8AD) no-repeat left center;
border:1px dotted #00f;
background-size:16px;
padding-left:18px;
cursor:auto;}
.cke_contents_ltr img.cke_anchor{background:url(http://localhost/public/js/fullckeditor/plugins/link/images/anchor.png?t=D8AD) no-repeat left center;border:1px dotted #00f;background-size:16px;width:16px;min-height:15px;height:1.15em;vertical-align:text-bottom;}
.cke_contents_rtl a.cke_anchor,
.cke_contents_rtl a.cke_anchor_empty,
.cke_editable.cke_contents_rtl a[name],
.cke_editable.cke_contents_rtl a[data-cke-saved-name]
{background:url(http://localhost/public/js/fullckeditor/plugins/link/images/anchor.png?t=D8AD) no-repeat right center;
border:1px dotted #00f;
background-size:16px;
padding-right:18px;
cursor:auto;}
.cke_contents_rtl img.cke_anchor{
background:url(http://localhost/public/js/fullckeditor/plugins/link/images/anchor.png?t=D8AD) no-repeat right center;
border:1px dotted #00f;
background-size:16px;
width:16px;
min-height:15px;
height:1.15em;
vertical-align:text-bottom;}
div.cke_pagebreak{
background: url(http://localhost/public/js/fullckeditor/plugins/pagebreak/images/pagebreak.gif?t=D8AD) no-repeat center center !important;
clear: both !important;
width:100% !important;
_width:99.9% !important;
border-top: #999999 1px dotted !important;
border-bottom: #999999 1px dotted !important;
padding:0 !important;height: 5px !important;
cursor: default !important;}
Showblock显示编辑块名称。是指的编辑器底部的Showblock插件。这些css定义其对应的style以及图片。
.cke_show_blocks p,
.cke_show_blocks div,
.cke_show_blocks pre,
.cke_show_blocks address,
.cke_show_blocks blockquote,
.cke_show_blocks h1,
.cke_show_blocks h2,
.cke_show_blocks h3,
.cke_show_blocks h4,
.cke_show_blocks h5,
.cke_show_blocks h6{background-repeat: no-repeat;border: 1px dotted gray;padding-top: 8px;}
.cke_show_blocks p{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_p.png);}
.cke_show_blocks div{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_div.png);}
.cke_show_blocks pre{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_pre.png);}
.cke_show_blocks address{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_address.png);}
.cke_show_blocks blockquote{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_blockquote.png);}
.cke_show_blocks h1{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_h1.png);}
.cke_show_blocks h2{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_h2.png);}
.cke_show_blocks h3{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_h3.png);}
.cke_show_blocks h4{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_h4.png);}
.cke_show_blocks h5{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_h5.png);}
.cke_show_blocks h6{background-image: url(http://localhost/public/js/fullckeditor/plugins/showblocks/images/block_h6.png);}
.cke_show_blocks.cke_contents_ltr p,
.cke_show_blocks.cke_contents_ltr div,
.cke_show_blocks.cke_contents_ltr pre,
.cke_show_blocks.cke_contents_ltr address,
.cke_show_blocks.cke_contents_ltr blockquote,
.cke_show_blocks.cke_contents_ltr h1,
.cke_show_blocks.cke_contents_ltr h2,
.cke_show_blocks.cke_contents_ltr h3,
.cke_show_blocks.cke_contents_ltr h4,
.cke_show_blocks.cke_contents_ltr h5,
.cke_show_blocks.cke_contents_ltr h6{background-position: top left;padding-left: 8px;}
.cke_show_blocks.cke_contents_rtl p,
.cke_show_blocks.cke_contents_rtl div,
.cke_show_blocks.cke_contents_rtl pre,
.cke_show_blocks.cke_contents_rtl address,
.cke_show_blocks.cke_contents_rtl blockquote,
.cke_show_blocks.cke_contents_rtl h1,
.cke_show_blocks.cke_contents_rtl h2,
.cke_show_blocks.cke_contents_rtl h3,
.cke_show_blocks.cke_contents_rtl h4,
.cke_show_blocks.cke_contents_rtl h5,
.cke_show_blocks.cke_contents_rtl h6{background-position: top right;padding-right: 8px;}
.cke_show_borders table.cke_show_border,
.cke_show_borders table.cke_show_border > tr > td,
.cke_show_borders table.cke_show_border > tr > th,
.cke_show_borders table.cke_show_border > tbody > tr > td,
.cke_show_borders table.cke_show_border > tbody > tr > th,
.cke_show_borders table.cke_show_border > thead > tr > td,
.cke_show_borders table.cke_show_border > thead > tr > th,
.cke_show_borders table.cke_show_border > tfoot > tr > td,
.cke_show_borders table.cke_show_border > tfoot > tr > th{border : #d3d3d3 1px dotted}