Crear un elemento HTML <img> online
El Generador HTML Image Code crea un elemento <img> a partir del origen de la imagen, el texto alternativo y las dimensiones opcionales que indiques. La vista previa, el resultado HTML y el resultado C# se actualizan a la vez para que puedas comprobar el elemento antes de copiarlo en una página web o un proyecto .NET.
Opciones del Generador HTML Image Code
El generador interactivo incluye estas opciones:
- Source admite una ruta relativa o una URL absoluta de imagen para el atributo
src. - Alt Text describe una imagen informativa. Deja el campo vacío únicamente cuando la imagen sea decorativa.
- Width y Height añaden dimensiones enteras positivas opcionales en píxeles CSS.
La vista previa y los dos paneles de código se actualizan automáticamente. Si una dimensión está vacía, el generador omite ese atributo y permite que el navegador use el tamaño intrínseco de la imagen.
Crear un elemento HTML <img> en C#
El panel HTML Code contiene el marcado <img> configurado. El panel C# Code crea debajo un elemento equivalente con
Aspose.HTML for .NET
.
El código generado sigue estos pasos:
- Crea un
HTMLDocumenty unHTMLImageElementmedianteDocument.CreateElement(). - Establece
SrcyAlty, si se han indicado dimensiones, tambiénWidthyHeight. - Añade la imagen al cuerpo del documento mediante
Node.AppendChild(). - Guarda el documento terminado como
image.htmlmedianteHTMLDocument.Save().
Configura primero la imagen y copia después el código C# actualizado en tu proyecto .NET.
Preguntas frecuentes sobre el Generador HTML Image Code
1. ¿Qué texto alternativo debo introducir para una imagen?
Describe el contenido o la función de la imagen teniendo en cuenta el contexto de la página. Usa un valor alt vacío para una imagen puramente decorativa, de modo que las tecnologías de asistencia puedan ignorarla. No uses el nombre del archivo ni repitas texto cercano sin aportar información.
2. ¿Por qué no aparece la imagen en la vista previa?
Comprueba que Source apunte a una imagen existente que el navegador pueda solicitar. Las rutas relativas se resuelven desde la URL de la página actual. Un servidor externo puede bloquear la solicitud, exigir autenticación o impedir el enlace directo a la imagen.
3. ¿Debo especificar tanto Width como Height?
Indicar ambas dimensiones intrínsecas permite al navegador reservar espacio antes de cargar la imagen y puede reducir los cambios de diseño. Usa valores que conserven la relación de aspecto de la imagen original, ya que valores incompatibles pueden deformarla.
4. ¿Puedo usar una ruta relativa en lugar de una URL completa?
Sí. Un src relativo se resuelve con respecto a la URL del documento HTML, por lo que la ruta debe ser válida en el lugar donde se publique la página. Usa una URL HTTP o HTTPS absoluta cuando la imagen esté alojada en otro sitio.
5. ¿Puedo añadir la imagen generada a un documento HTML existente?
Sí. Abre el archivo con new HTMLDocument("input.html"), crea y configura la imagen como se muestra, añádela al elemento necesario y guarda el documento modificado en un archivo nuevo.
Instalar Aspose.HTML for .NET
Instale Aspose.HTML for .NET desde NuGet con la CLI de .NET:
dotnet add package Aspose.HTML
También puede usar la interfaz del Administrador de paquetes NuGet o ejecutar Install-Package Aspose.HTML en la consola del Administrador de paquetes. Consulte la
guía de instalación
para configurar la biblioteca o solicite una
licencia temporal
para evaluar la API sin limitaciones.
Otros generadores HTML
Crea otros elementos y estructuras HTML con generadores especializados