Adicionar imagem ao HTML – C#

Como adicionar imagem ao HTML

As imagens desempenham um papel importante na comunicação eficaz de informações. Portanto, adicionar imagens a documentos HTML é um aspecto crítico e um requisito comum no desenvolvimento web. Aspose.HTML for .NET fornece uma solução robusta para desenvolvedores gerenciarem imagens em documentos HTML. Você pode inserir uma imagem, manipulá-la e removê-la ou extraí-la de documentos HTML. Vamos explorar como adicionar imagens a documentos HTML.

Primeiro, certifique-se de ter Aspose.HTML for .NET instalado em seu projeto. O processo de instalação desta biblioteca é bastante simples. Abra o gerenciador de pacotes NuGet, procure Aspose.HTML e instale. Você também pode usar o seguinte comando do Console do Gerenciador de Pacotes:

Install-Package Aspose.HTML

Elemento de imagem HTML

Você pode adicionar imagens a documentos HTML e páginas da web usando um elemento HTML <img>. O elemento de imagem HTML requer atributos src e alt. O atributo src contém uma URL apontando para a imagem que você deseja incorporar em um documento HTML ou página da web. A URL no atributo src pode ser relativa ou absoluta. Sem o atributo src, o elemento <img> não possui uma imagem para carregar. O atributo alt especifica um texto alternativo para a imagem. Abaixo estão três opções para especificar o atributo src para um elemento <img> – com uma URL relativa para uma fonte de imagem, uma URL absoluta e com dados URI (imagem codificada em 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." >

Adicionar imagem ao documento HTML usando C#

Usando a biblioteca de classes Aspose.HTML for .NET, você pode criar facilmente seu próprio aplicativo, já que nossa API fornece um conjunto de ferramentas poderoso para analisar e editar documentos HTML. Se você deseja adicionar imagem programaticamente ao HTML, consulte o exemplo de código C# abaixo:

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

Etapas para adicionar imagem ao HTML

Neste exemplo, um novo elemento de imagem HTML é criado, os atributos são definidos e a imagem é anexada ao documento HTML. O resultado é um documento HTML modificado com a imagem adicionada:

1. Carregue o documento HTML usando o construtor HTMLDocument()
2. Crie um novo elemento de imagem usando o método CreateElement() .
3. Defina atributos para a imagem, como a fonte src e o texto alternativo alt.
4. Anexe o novo elemento de imagem ao documento HTML. Use o método AppendChild() da classe Node para adicionar a imagem ao final da lista de filhos do corpo do documento.
5. Chame o método Save() para salvar o documento HTML modificado com a imagem adicionada.

Aspose.HTML for .NET é uma biblioteca avançada de análise de HTML. É possível criar, editar, navegar pelos nós, extrair dados, mesclar e converter arquivos HTML, XHTML, MD, EPUB e MHTML em PDF, DOCX, imagens e outros formatos populares. Além disso, ele também lida com CSS, HTML Canvas, SVG, XPath e JavaScript prontos para uso para estender as tarefas de manipulação. Para obter mais detalhes sobre a instalação da biblioteca C# e requisitos do sistema, consulte Documentação Aspose.HTML .

Verificador de tags alt de imagem – aplicativo on-line

Aspose.HTML oferece o Verificador de tags alt de imagem é uma ferramenta online gratuita projetada para analisar um site e identificar imagens sem atributos alt corretos. O aplicativo verifica uma página da web, encontra imagens sem texto alternativo e cria um relatório indicando quais imagens precisam de atributos alt descritivos. Os desenvolvedores podem usar esta ferramenta para garantir que seus sites atendam aos padrões de acessibilidade WCAG.