我可以使用TinyMCE格式配置为给定对齐的不同元素设置不同的类吗?

时间:2013-09-03 10:41:09

标签: css tinymce css-selectors

例如,我正在使用

formats : {
    alignleft : {selector : 'img', classes : 'float-left'},
    alignright : {selector : 'img', classes : 'float-right'},
    }

将float类应用于左/右对齐的img元素而不是内联样式。我知道我可以在技术上只是向选择器添加',p'也给它们“float-left / right”类,然后在CSS中为p元素调整类选择器,但我宁愿给它们一个不同的类“文本右/左”。

我尝试将alignleft : {selector : 'p', classes : 'text-left'}附加到格式配置数组,但它只是覆盖了img float类配置。

我想要实现的目标是什么?

1 个答案:

答案 0 :(得分:0)

试试这个tinymce config

formats: {
    alignleft: [
        {selector : 'div.nb-image,img', classes: 'float-left'},
        {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table', styles: {'text-align': 'left'}}
    ],
    aligncenter: [
        {selector : 'div.nb-image,img', classes: 'float-center'},
        {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table', styles: {'text-align': 'center'}}
    ],
    alignright: [
        {selector : 'div.nb-image,img', classes: 'float-right'},
        {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table', styles: {'text-align': 'right'}}
    ],
    alignfull: [
        {selector : 'div.nb-image,img', classes: 'float-full'},
        {selector : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table', styles: {'text-align': 'justify'}}
    ]
}