TinyMCEテキストエリアの行間隔を小さくする

Question

TinyMCEを使用してリッチテキスト編集用テキストエディタを提供しています。しかし、行間の行間隔は大きすぎます。私は、入力を押すと表示される行間隔を示すスクリーンショットを追加しました。それについて何ができるのですか

Answer 1

TinyMCE htmlコンテンツに適用されるCSSクラスがあります。スペーシングを引き起こすタグが<p>あるようです。正直、それは私にはかなり良いようです。しかし、あなたはCSSクラスでオーバーライドできます：

.tinymce-content p { 
    padding: 0; 
    margin: 2px 0; 
} 

詳細については、tinymce docsを参照してください。

Answer 2

あなたはこのようなあなたのCSSエディタにカスタムCSSを追加することができます。

tinyMCE.init({ 
     ... 
     editor_css : "/content_css.css" 
}); 

はこちらのドキュメントを参照してください：http://www.tinymce.com/wiki.php/Configuration:editor_css

あなたがそのファイルにあなたが望むものは何でも高さに行の高さプロパティを設定することができます。 http://www.tinymce.com/wiki.php/Configuration:force_br_newlines

：

tinyMCE.init({ 
     ... 
     force_br_newlines : true, 
     force_p_newlines : false, 
     forced_root_block : '' // Needed for 3.x 
}); 

は、詳細はこちらのドキュメントを参照してください：

また、あなたはこのようなものを生成する段落タグ（P）または改行タグ（BR）を切り替えることができ、設定を変更することができます

私はTinyMCEがあなたがあなたのラインの間に大きなマージンを得るなぜ、あなたが入力を押すと、段落を標準で行うと思います。 Wordのようにshift + enterを使用して、段落ではなく改行である新しい行を取得することもできます。

Answer 3

TinyMCEに段落の代わりにdivを出力させることができます。

forced_root_block : 'div', 

Answer 4

私が知っている、 この投稿は古いですが、それは、誰かを助けるかもしれない：ちょうどあなたのtinyMCE.initセクションにこの行を置きます。

'force_br_newlines'と 'force_p_newlines'は3.5から推奨されていません。代わりに

使用forced_root_blocks：

tinyMCE.init({ 
     ... 
     force_br_newlines : true, 
     force_p_newlines : false, 
     forced_root_block : '' // Needed for 3.x 
}); 

Answer 5

は、これは私がこれまでに遭遇した最適なソリューションです...あなたはそれを使用することができますので：

tinyMCE.init({ 
    style_formats : [ 
      {title : 'Line height 20px', selector : 'p,div,h1,h2,h3,h4,h5,h6', styles: {lineHeight: '20px'}}, 
      {title : 'Line height 30px', selector : 'p,div,h1,h2,h3,h4,h5,h6', styles: {lineHeight: '30px'}} 
    ] 
}); 

とにかく...私のために働きましたあなたは

このオプションを指定することができTinyMCEの4.xから

Answer 6

pタグごとにstyle: margin: 5px 0;が追加されます。

P.S：コピー/ペーストコンテンツでは機能しません。

は参照してください：http://archive.tinymce.com/wiki.php/Configuration:forced_root_block_attrs