addStylesSet如何與內容css交互？

我已經重定向contents.css文件爲我的CKEditor 3.6到我的網站的樣式表：addStylesSet如何與內容css交互？

CKEDITOR.config.contentsCss = '/css/style.css';

現在我想從樣式表中添加一些樣式到下拉框供用戶編輯內容時進行選擇。前面的開發者創建了這個：

CKEDITOR.addStylesSet('cms_styles', 
[ 
    { 
     name : 'Page Header', 
     element : 'h2' 
    }, 

    { 
     name : 'Page Text', 
     element : 'p' 
    },

它似乎工作，但對我來說沒什麼意義。鑑於類名不能有空格，這些從哪裏獲得他們的風格？如果我們只是將樣式添加到下拉列表中，爲什麼要指定元素？ Google對addStylesSet沒有好的結果，我發現的開發者指南（http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Styles）確實不是很具體。

我不想顯示所有可用的類;只是我們定義的幾個。

來源

2014-09-06 Nicholas

樣式對象上的name屬性僅用於顯示目的，它不會以任何方式將其置入內容中。以前的開發人員創建的工作原理是因爲這些樣式只是指定了元素，並且css可能使用這些元素說明符定義了樣式。

element屬性正在設置，以便CKEditor知道如何將該樣式應用於內容。如果您的element屬性的樣式值爲p，則該樣式將成爲塊樣式，並將應用於內容中當前活動的p塊。如果element屬性的值爲span，則該樣式將僅應用於所選文本（如果其中一個不存在，它將被一個span元素包圍）。

要在下拉菜單中獲取樣式以表示您的外部css中的類，您需要將樣式對象添加到樣式集，並設置樣式要應用到的元素的class屬性。通過在樣式對象的attributes屬性上設置屬性，可以讓CKEditor在要應用樣式的元素上添加或修改屬性。爲了達到我們的目的，我們要設置attributes屬性的class屬性，以便在您的css中應用定義的類。

CSS：

p.myBlockStyle { 
    font-size: 32px; 
}

CKEditor的stylesSet陣列：

[ 
    { 
     name: "My Block Style", 
     element: "p", 
     attributes: { 
      "class": "myBlockStyle" 
     } 
    } 
]

注意，class財產有它的名字引用，因爲class是保留關鍵字。

來源

2014-09-10 02:39:46

addStylesSet如何與內容css交互？

回答

相關問題