Я использую TinyMCE для создания текстового редактора с улучшенным текстом. Но расстояние между линиями слишком велико. Я добавил скриншот, который показывает интервал между строками, который я нажимаю на ввод. Что можно сделать с этим
Уменьшить интервал между строками в текстовом поле TinyMCE
Ответ 1
Существует класс css, который применяется к содержимому html TinyMCE. Похоже, у вас есть теги <p>
, вызывающие интервал. Честно говоря, это выглядит очень хорошо для меня. Но вы можете переопределить класс css:
.tinymce-content p {
padding: 0;
margin: 2px 0;
}
Подробнее см. tinymce docs.
Ответ 2
Вы можете добавить пользовательский CSS в свой CSS-редактор следующим образом:
tinyMCE.init({
...
editor_css : "/content_css.css"
});
См. документы здесь: http://www.tinymce.com/wiki.php/Configuration:editor_css
Затем вы можете установить свойство line height для любой высоты, которая вам нужна в этом файле.
Вы также можете изменить настройку, в которой вы можете переключаться между генерирующими тегами абзаца (p) или тегами linebreak (br) примерно следующим образом:
tinyMCE.init({
...
force_br_newlines : true,
force_p_newlines : false,
forced_root_block : '' // Needed for 3.x
});
Подробнее см. в документах: http://www.tinymce.com/wiki.php/Configuration:force_br_newlines
Я думаю, что TinyMCE делает параграфы как стандартные, когда вы нажимаете enter, поэтому вы получаете большой запас между вашими линиями. Вы также можете использовать shift + enter, как в Word, чтобы получить новую строку, которая представляет собой разрыв строки вместо абзаца.
Ответ 3
Вы можете заставить TinyMCE выводить divs вместо абзацев. Просто поместите эту строку в свой раздел tinyMCE.init:
forced_root_block : 'div',
Ответ 4
Я знаю, Этот пост старый, но он может помочь кому-то.
'force_br_newlines' и 'force_p_newlines' устарели от 3.5.
Используйте принудительные_роты_блоки:
tinyMCE.init({
...
force_br_newlines : true,
force_p_newlines : false,
forced_root_block : '' // Needed for 3.x
});
Ответ 5
Из tinyMCE 4.x вы можете указать эту опцию
forced_root_block_attrs: { "style": "margin: 5px 0;" }
это добавит style: margin: 5px 0;
для каждого тега p
.
P.S: он не будет работать для копирования/вставки содержимого.
Обратитесь: http://archive.tinymce.com/wiki.php/Configuration:forced_root_block_attrs
Ответ 6
Это лучшее решение, с которым я столкнулся до сих пор... поэтому вы можете его использовать:
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'}}
]
});
В любом случае... это сработало для меня
Ответ 7
Если вы хотите иногда иметь дополнительное место, а иногда нет, оставьте TinyMCE как есть. И когда вы хотите, чтобы между абзацами было меньше места, чем нажимать клавишу ввода, чтобы перейти к следующей строке, нажмите клавишу ввода и сдвиньте вместе.