Bild zu HTML hinzufügen – C#

So fügen Sie ein Bild zu HTML hinzu

Bilder spielen eine wichtige Rolle bei der effektiven Informationsvermittlung. Daher ist das Hinzufügen von Bildern zu HTML-Dokumenten ein kritischer Aspekt und eine häufige Anforderung bei der Webentwicklung. Aspose.HTML for .NET bietet Entwicklern eine robuste Lösung zum Verwalten von Bildern in HTML-Dokumenten. Sie können ein Bild einfügen, bearbeiten und aus HTML-Dokumenten entfernen oder extrahieren. Sehen wir uns an, wie man Bilder zu HTML-Dokumenten hinzufügt.

Stellen Sie zunächst sicher, dass Aspose.HTML for .NET in Ihrem Projekt installiert ist. Der Installationsprozess dieser Bibliothek ist relativ einfach. Sie können es über die NuGet Package Manager-Konsole mit dem folgenden Befehl installieren:

Install-Package Aspose.HTML

HTML-Bildelement

Sie können Bilder zu HTML-Dokumenten und Webseiten hinzufügen, indem Sie ein HTML-Element <img> verwenden. Das HTML-Bildelement erfordert die Attribute src und alt. Das Attribut src enthält eine URL, die auf das Bild verweist, das Sie in ein HTML-Dokument oder eine Webseite einbetten möchten. Die URL im Attribut src kann relativ oder absolut sein. Ohne das Attribut src verfügt das Element <img> nicht über ein zu ladendes Bild. Das Attribut alt gibt alternativen Text für das Bild an. Nachfolgend finden Sie drei Optionen zum Angeben des src-Attributs für ein <img>-Element – ​​mit einer relativen URL für eine Bildquelle, einer absoluten URL und mit URI-Daten (Base64-codiertes Bild):

<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." >

Bild mit C# zum HTML-Dokument hinzufügen

Mit der Klassenbibliothek Aspose.HTML for .NET können Sie ganz einfach Ihre eigene Anwendung erstellen, da unsere API ein leistungsstarkes Toolset zum Parsen und Bearbeiten von HTML-Dokumenten bereitstellt. Wenn Sie Bilder programmgesteuert zu HTML hinzufügen möchten, sehen Sie sich das folgende C#-Codebeispiel an:

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);
    }

Schritte zum Hinzufügen von Bildern zu HTML

In diesem Beispiel wird ein neues HTML-Bildelement erstellt, Attribute festgelegt und das Bild an das HTML-Dokument angehängt. Das Ergebnis ist ein modifiziertes HTML-Dokument mit dem hinzugefügten Bild:

1. Laden Sie das HTML-Dokument mit dem Konstruktor HTMLDocument() .
2. Erstellen Sie ein neues Bildelement mit der Methode CreateElement() .
3. Legen Sie Attribute für das Bild fest, z. B. die Quelle src und den Alternativtext alt.
4. Hängen Sie das neue Bildelement an das HTML-Dokument an. Verwenden Sie die Methode AppendChild() der Node-Klasse, um das Bild am Ende der Liste der untergeordneten Elemente des Dokumentkörpers hinzuzufügen.
5. Rufen Sie die Methode Save() auf, um das geänderte HTML-Dokument mit dem hinzugefügten Bild zu speichern.

Aspose.HTML for .NET ist eine erweiterte HTML-Parsing-Bibliothek. Man kann erstellen, bearbeiten, durch Knoten navigieren, Daten extrahieren, HTML-, XHTML-, MD-, EPUB- und MHTML-Dateien zusammenführen und in PDF, DOCX, Bilder und andere gängige Formate konvertieren. Darüber hinaus verarbeitet es auch sofort CSS, HTML Canvas, SVG, XPath und JavaScript, um Manipulationsaufgaben zu erweitern. Weitere Informationen zur Installation der C#-Bibliothek und zu den Systemanforderungen finden Sie in der Aspose.HTML-Dokumentation .

Bild Alt Tag Checker – Online-App

Aspose.HTML bietet den Bild Alt Tag Checker an, ein kostenloses Online-Tool zur Analyse einer Website und zur Identifizierung von Bildern, denen korrekte alt-Attribute fehlen. Die Anwendung scannt eine Webseite, findet Bilder ohne Alt-Text und erstellt einen Bericht, der angibt, welche Bilder beschreibende alt-Attribute benötigen. Entwickler können dieses Tool verwenden, um sicherzustellen, dass ihre Websites den WCAG-Zugänglichkeitsstandards entsprechen.