Додати зображення до HTML – C#

Як додати зображення до HTML

Зображення відіграють важливу роль в ефективній передачі інформації. Тому додавання зображень до HTML-документів є важливим аспектом і загальною вимогою веб-розробки. Aspose.HTML for .NET надає розробникам надійне рішення для керування зображеннями в документах HTML. Ви можете вставляти зображення, маніпулювати ним, видаляти або витягувати його з документів HTML. Давайте дослідимо, як додавати зображення до документів HTML.

По-перше, переконайтеся, що у вашому проекті встановлено Aspose.HTML for .NET . Процес додавання цієї бібліотеки досить простий. Відкрийте менеджер пакетів NuGet, знайдіть Aspose.HTML і встановіть. Ви також можете використати таку команду з консолі диспетчера пакетів:

Install-Package Aspose.HTML

Елемент зображення HTML

Ви можете додавати зображення до HTML-документів і веб-сторінок за допомогою HTML-елемента <img>. Для елемента зображення HTML потрібні атрибути src і alt. Атрибут src містить URL-адресу, яка вказує на зображення, яке потрібно вбудувати в HTML-документ або веб-сторінку. URL-адреса в атрибуті src може бути відносною або абсолютною. Без атрибута src елемент <img> не має зображення для завантаження. Атрибут alt визначає альтернативний текст для зображення. Нижче наведено три варіанти вказівки атрибута src для елемента <img> – з відносною URL-адресою для джерела зображення, абсолютною URL-адресою та з даними URI (зображення в кодуванні Base64):

<img src="images/photo.png" alt="A descriptive alt text" >

<img src="https://docs.aspose.com/html/images/georgia-castle.png" alt="Ananuri Fortress Complex in Georgia" >

<img src="data:image/jpeg;base64,/9j/4RLYRXhpZgAAS..." alt="The muzzle of a lioness close-up. The lioness looks away." >

Додайте зображення до HTML-документа за допомогою C#

Використовуючи бібліотеку класів Aspose.HTML for .NET, ви можете легко створити власний застосунок, оскільки наш API надає потужний набір інструментів для аналізу та редагування документів HTML. Якщо ви хочете програмно додати зображення до HTML, перегляньте приклад коду C# нижче:

using Aspose.Html;
using System.IO;
...

    // Prepare a path to a source HTML file
    string documentPath = Path.Combine(DataDir, "document.html");

    // Prepare a path for resulting file saving 
    string savePath = Path.Combine(OutputDir, "add-image.html");

    // Create an instance of an HTML document
    using (var document = new HTMLDocument(documentPath))
    {
        var body = document.Body;

        // Create an image element
        var image = (HTMLImageElement)document.CreateElement("img");
        image.Src = "images/photo.png";
        image.Alt = "A descriptive alt text";

        // Attach the image to the document body
        body.AppendChild(image);

        // Save the HTML document to a file
        document.Save(savePath);
    }

Кроки для додавання зображення до HTML

У цьому прикладі створюється новий елемент зображення HTML, встановлюються атрибути, а зображення додається до документа HTML. Результатом є змінений HTML-документ із доданим зображенням:

1. Завантажте HTML-документ за допомогою конструктора HTMLDocument() .
2. Створіть новий елемент зображення за допомогою методу CreateElement() .
3. Встановіть атрибути для зображення, такі як джерело src і альтернативний текст alt.
4. Додайте новий елемент зображення до документа HTML. Використовуйте метод AppendChild() класу Node, щоб додати зображення в кінець списку дочірніх елементів тіла документа.
5. Викличте метод Save() , щоб зберегти змінений HTML-документ із доданим зображенням.

Aspose.HTML for .NET – це розширена бібліотека аналізу HTML. Можна створювати, редагувати, переміщатися між вузлами, витягувати дані, об’єднувати та конвертувати файли HTML, XHTML, MD, EPUB і MHTML у PDF, DOCX, зображення та інші популярні формати. Крім того, вона також обробляє CSS, HTML Canvas, SVG, XPath і JavaScript, щоб розширити завдання маніпулювання. Додаткову інформацію про встановлення бібліотеки C# і системні вимоги ви знайдете у документації Aspose.HTML .

Перевірка alt тегів зображень – онлайн-застосунок

Aspose.HTML пропонує Перевірка alt тегів зображень – безкоштовний онлайн-інструмент, призначений для аналізу веб-сайту та виявлення зображень без правильних атрибутів alt. Застосунок сканує веб-сторінку, знаходить зображення без тексту заміщення та створює звіт із зазначенням того, які зображення потребують описових атрибутів alt. Розробники можуть використовувати цей інструмент, щоб забезпечити відповідність своїх веб-сайтів стандартам доступності WCAG.