Текстовый редактор HTML на основе Windows Forms. Как уменьшить расстояние между строк? - C#

268

19 мая 2018, 14:30

Как уменьшить расстояние между строк?

Исходный проект+описание - ссылка
Проект(дублирую) - ссылка

РЕШЕНИЕ 1. Не работает.
Решение, которое на мой взгляд подходит это заменить html код страницы загрузки, которая подставляется в браузер(webBrowser1) при старте приложения на код со стилем расстояния между строк.

Исходный код

webBrowser1.DocumentText = "<html><body></body></html>";

Исправленный

webBrowser1.DocumentText = "<html><head> <style>  p, h1, h2, h3 {margin: 0; padding: 0} </style></head><body><p>Строка 291_1</p><p>Строка 291_2</p></body></html>";

РЕШЕНИЕ 2. Не работает.
Изменил HTML код

/// <summary>
        /// Add document body, turn on design mode on the whole document, 
        /// and overred the context menu
        /// </summary>
        static string docText = @"<!DOCTYPE html>   
<html><head> <style>  p, h1, h2, h3 {margin: 0; padding: 0} </style>    
<style>
p {
    line-height: 0.7;
}   
</style>    
</head><body><p>Строка 291_1</p><p>Строка 291_2</p></body></html>   
";
        private void SetupBrowser()
        {
            webBrowser1.DocumentText = docText;
            // webBrowser1.DocumentText = "<html><body></body></html>"; // исходный вариант строки
            doc =
            webBrowser1.Document.DomDocument as IHTMLDocument2;
            doc.designMode = "On";
            webBrowser1.Document.ContextMenuShowing += 
                new HtmlElementEventHandler(Document_ContextMenuShowing);
        }

Answer 1

Берем текст из примера

static string docText = @"<!DOCTYPE html>
<html>
<head>
<style>
p.small {
    line-height: 0.7;
}
p.big {
    line-height: 1.8;
}
</style>
</head>
<body>
<p>
This is a paragraph with a standard line-height.<br>
The default line height in most browsers is about 110% to 120%.<br>
</p>
<p class=""small"">
This is a paragraph with a smaller line-height.<br>
This is a paragraph with a smaller line-height.<br>
</p>
<p class=""big"">
This is a paragraph with a bigger line-height.<br>
This is a paragraph with a bigger line-height.<br>
</p>
</body>
</html>";

Создаем форму с ним

public class MyForm : Form
{
    public MyForm()
    {
        this.Width = 500;
        this.Height = 500;
        var wb = new WebBrowser();
        wb.Width = 500;
        wb.Height = 500;

        this.Controls.Add(wb);
        wb.DocumentText = docText;
    }
}

Запускаем форму

new MyForm().ShowDialog();

Получаем

Как видите, все работает. Почему не работает у вас - разбирайтесь с вашими стилями.

Если взять то, что было приведено в вопросе, и добавить туда стиль, показанный выше

static string docText = @"<!DOCTYPE html>   
<html><head> <style>  p, h1, h2, h3 {margin: 0; padding: 0} </style>    
<style>
p {
    line-height: 0.7;
}   
</style>    
</head><body><p>Строка 291_1</p><p>Строка 291_2</p></body></html>   
";

То получится

UPD

Перечитал вопрос. Заметил вот это

doc.designMode = "On";

Чем бы оно не было, оно полностью переписывает документ (по крайней мере для меня). Пришлось добавить стиль таким образом:

public class MyForm : Form
{
    public MyForm()
    {
        this.Width = 500;
        this.Height = 500;
        var wb = new WebBrowser();
        wb.Width = 500;     
        wb.Height = 500;        
        wb.DocumentCompleted += async (sender, args) => 
        { 
            var doc = wb.Document.DomDocument as IHTMLDocument2;            
            doc.designMode = "On";
            while (doc.readyState != "complete")
            {
                await Task.Delay(100);              
            }
            var stylesheet = doc.createStyleSheet();
            stylesheet.addRule("p", "line-height: 0;");
        };
        wb.DocumentText = string.Empty;
        this.Controls.Add(wb);      
    }
}