如何在TinyMce中設置字體大小

我知道有很多Q &就這一點而言，至今我還沒有找到幫助我的人。如何在TinyMce中設置字體大小

無論我如何處理我的css文件 - 「content.min.css etc」 - 總是似乎有一個內聯元素「font-size：small」。否則，即使我在「content.min.css」中選擇「font-size：15pt！important」。

這是從生成TinyMCE的代碼的HTML：

<body id="tinymce" class="mce-content-body " contenteditable="true" onload="window.parent.tinymce.get('mce_1').fire('load');" spellcheck="false"> 
    <p> 
     <span data-mce-style="font-size: small;"></span> 
    </p> 
    <p> 
     <span data-mce-style="font-size: small;" style="font-size: small;"></span> 
    </p> 
</body>

我想擺脫'style =的「前大小：小;」設置。但是如何？

來源

2014-09-26 Asle G

你檢查過嗎？ http://ahoj.io/how-to-make-tinymce-to-output-clean-html – emmanuel 2014-09-26 07:08:59

太棒了！感謝名單。它幫助我邁出了一步。現在我必須找到正確的content.min.css文件。我在「http://tinymce.cachefly.net/4.0/tinymce.min.js」使用CDN任何想法？ – 2014-09-26 07:34:44

請檢查：http：//www.tinymce.com/wiki.php/configuration:content_css – emmanuel 2014-09-26 07:38:43

解決方案：

包括在ko.bindingHandler TinyMCE的選項 content_css：「/my-local-path/mycontent.css」
添加文件「/我的本地-path/mycontent.css「給你的解決方案

我張貼我的bindingHandler，以防萬一其他需要看到一個例子。

ko.bindingHandlers.tinymce = { 
init: function (element, valueAccessor, allBindingsAccessor, 
       context, arg1, arg2) { 
    var options = allBindingsAccessor().tinymceOptions || {}; 
    var modelValue = valueAccessor(); 
    var value = ko.utils.unwrapObservable(valueAccessor()); 

    var el = $(element); 
    var id = el.attr('id'); 

    //options.theme = "advanced"; 
    //options.theme = "modern"; 
    options.content_css = "/DesktopModules/MyModule/css/mycontent.css"; // DNN7.1 with module name "MyModule" 

    options.menubar = false; 
    options.plugins = [ 
     "advlist autolink autosave link image lists charmap print preview hr anchor pagebreak spellchecker", 
     "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking", 
     "table contextmenu directionality template textcolor paste fullpage textcolor" 
    ]; 

    options.extended_valid_elements = "span[!class]"; 


    //tinymce buttons 
    //http://www.tinymce.com/tryit/classic.php 
    options.toolbar_items_size = 'small'; 
    options.toolbar = 
    "bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | forecolor backcolor | hr removeformat | subscript superscript "; 

    //options.inline = "true"; 

    //handle edits made in the editor. Updates after an undo point is reached. 
    options.setup = function (editor) { 
     editor.on('change', function (e) { 
      if (ko.isWriteableObservable(modelValue)) { 
       var content = editor.getContent({ format: 'raw' }); 
       modelValue(content); 
      } 
     }); 

    }; 

    el.html(value); 

    $(element).tinymce(options); 

    //handle disposal (if KO removes by the template binding) 
    ko.utils.domNodeDisposal.addDisposeCallback(element, function() { 
     var tinymceInstance = tinyMCE.get(id); 
     if (tinymceInstance !== undefined) { 
      // if instance already exist, then get rid of it... we don't want it 
      tinymceInstance.remove(); 
     } 
    }); 
}, 
update: function (element, valueAccessor, allBindingsAccessor, context) { 

    var el = $(element); 
    var value = ko.utils.unwrapObservable(valueAccessor()); 
    var id = el.attr('id'); 

    //handle programmatic updates to the observable 
    // also makes sure it doesn't update it if it's the same. 
    // otherwise, it will reload the instance, causing the cursor to jump. 
    if (id !== undefined) { 
     //$(el).tinymce(); 

     var tinymceInstance = tinyMCE.get(id); 
     if (!tinymceInstance) 
      return; 
     var content = tinymceInstance.getContent({ format: 'raw' }); 
     if (content !== value) { 
      //tinymceInstance.setContent(value); 
      valueAccessor(content); 
      //$(el).html(value); 
     } 
    } 
}};

「mycontent.css」的例子：

body#tinymce { 
    /* NB! Without specifying "#tinymce" this setting will effect other body´s */ 

    color: magenta;     // Just to show the difference 
    background-color: lightyellow; // Just to show the difference 
    font-family:Verdana, Arial, Helvetica, sans-serif; 
    font-size:14px; 
    margin:18px; 

}

來源

2014-09-26 08:41:29

如何在TinyMce中設置字體大小

回答

相關問題