Question

我在设置CKEditor实例的默认字体大小时遇到问题。我试过谷歌搜索，但没有找到任何回答我的问题。

我有一个页面，它接受一个网站的输入。有3个Editor实例，我必须将第一个实例的默认字体大小设置为20到30px。

我已经尝试修改CKEDITOR文件夹中找到的contents.css并更改其中的font-size但它会影响所有3个编辑器实例

/*
    Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
    For licensing, see LICENSE.html or http://ckeditor.com/license
    */

body
{
    /* Font */
    font-family: Georgia;
    font-size: 12px;

    /* Text color */
    color: #222;

    /* Remove the background color to make it transparent */
    background-color: #fff;
}

ol,ul,dl
{
    /* IE7: reset rtl list margin. (#7334) */
    *margin-right:0px;
    /* preserved spaces for rtl list item bullets. (#6249)*/
    padding-right:40px;
}

任何人都能弄清楚如何解决这个问题？非常感谢任何帮助！..

先谢谢你们..

mhond

Answer 1

我希望上面的答案可以帮助一些人。他们没有帮助我，这就是原因。使用firebug，我可以看到about：blank有一个p标签的默认字体，如上所述覆盖了我在contents.css文件中的设置。这是我做的修复它。我在body标签中添加了一个p，并在font-family和font-size行中添加了！important：

body, p {
    /* Font */
    font-family: Arial, Verdana, sans-serif !important;
    font-size: 12px !important;

    /* Text color */
    color: #000;

    /* Remove the background color to make it transparent */
    background-color: #fff;
}

工作得很好！我希望这会有所帮助。

Answer 2

您可以使用javascript API将一些样式添加到CKEditor实例

http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.stylesSet.html

// The set of styles for the Styles combo
CKEDITOR.stylesSet.add( 'default',
[
    // Block Styles
    { name : 'Blue Title'       , element : 'h3', styles : { 'color' : 'Blue' } },
    { name : 'Red Title'        , element : 'h3', styles : { 'color' : 'Red' } },

    // Inline Styles
    { name : 'Marker: Yellow'   , element : 'span', styles : { 'background-color' : 'Yellow' } },
    { name : 'Marker: Green'    , element : 'span', styles : { 'background-color' : 'Lime' } },

    // Object Styles
    {
        name : 'Image on Left',
        element : 'img',
        attributes :
        {
            'style' : 'padding: 5px; margin-right: 5px',
            'border' : '2',
            'align' : 'left'
        }
    }
 ]);

Answer 3

我们假设你想使用Verdana作为默认字体。您可以这样做：

打开contents.css并更改字体：

font-family: Verdana;
在将发布输出的应用程序/页面中，添加以下样式：

<style> .entry-content {font-family: Tahoma;} </style>

就是这样！现在您已成功更改默认字体。

Answer 4

我希望这会有所帮助。以下是我注意到的一些事情。

首先，我真的需要继续刷新以查看新的更改。我在/ ckeditor /目录中编辑了名为contents.css的.css文件，你可以改变这些：

color: #000000;
background-color: #ffffff;
font-size:24px; /* Just added this */

我还注意到你可以在/ckeditor/skins/kama/editor.css目录中编辑名为editor.css的文件。您可以将'kama'更改为您正在使用的任何皮肤。现在您可以编辑.cke_contents部分。

似乎content.css也会覆盖你在editor.css中所做的事情。希望这有助于你们。

确保刷新或清除缓存以查看是否有任何更改。

Answer 5

在页面示例中在CKEditor的文本区域中应用样式：

CKEDITOR.replace（＆＃39; textarea＆＃39;，{contentsCss：＆＃34; .cke_editable {font-size：18px; font-family：muna;}＆＃34;，font_defaultLabel：＆＃39; Muna＆＃39; ;，fontSize_defaultLabel：＆＃39; 18px＆＃39;}）;

Answer 6

这里设置CKEditor的默认字体大小：

<强>皮/ editor.css

.cke_reset_all，.cke_reset_all * {font：12px}

Answer 7

当检查我在编辑器中输入的元素时，我发现content.css文件实际上对字体样式有影响。

所以去ckeditor目录下的contents.css文件，进行这个改动：

.cke_editable{
font-size: 17px;
line-height: 1.6;}

如何在CKEditor上设置默认字体大小

7 个答案: