向CKEDITOR.stylesSet添加涉及多个元素的条目

时间:2012-11-14 11:06:58

标签: css cross-browser ckeditor

我有一个子弹列表设计,有两件事:

一个。替换列表图标的蓝色箭头图像

湾每个列表项目顶部和下方都有一个非常浅的虚线边框。

我想通过(CKEDITOR.stylesSet)将其构建到CKEditor中,以便用户可以从下拉列表中选择此特定样式的列表,而不必编写任何代码来执行此操作。

我已经取得了成功,我可以创建一个具有特定类的列表(现在已经有了主题)但是,遇到问题,因为它似乎是应用虚线和蓝色的唯一方法arrow是通过CSS3使用多个背景, SURPRISE ,在IE8或以下版本中不起作用。

如果我添加了一些DOM污染(即,在一个范围内包围列表项文本)我可以主题;然而,似乎CKEDITOR.stylesSet只允许为每个样式设置一个元素(即,我可以将ul设置为元素或将li设置为元素,但是我无法使用一种样式在UL上设置类并围绕带有跨度的子li元素的文本。

还是有吗?我正在考虑回到JavaScript,但我也愿意接受其他建议来完成我正在做的事情。

谢谢!

1 个答案:

答案 0 :(得分:1)

无需使用箭头或虚线的背景图像。你可以通过CSS做到这两点。你需要CKEditor做的就是将一个类应用到(它听起来像你已经是),然后使用类似于此的CSS:

.styled li {
    border-top: dotted 1px black;
    border-bottom: dotted 1px black;
}
.styled
{
    list-style: square url('http://www.wcb.ny.gov/site_images/blueArrow.gif')
}

完整的工作示例:http://jsfiddle.net/jwynveen/ZhjCK/