Cómo insertar texto en una imagen con HTML

Puedes añadir texto a las imágenes sin software de edición de fotos.
Por scott stanchak

Paso 1

Abre tu editor de HTML. Selecciona "Archivo" y "Nuevo" en la barra de navegación del programa. Un documento HTML en blanco aparecerá en la pantalla.


Paso 2

Codifica una nueva tabla. Establece las propiedades, border, cellspacing y cellpadding a 0. Esto permitirá que las celdas de la tabla queden al ras con la imagen.

Ejemplo: <table border="0" cellpadding="0" cellspacing="0"> </table>


Paso 3

Introduce un conjunto de datos y etiquetas para filas de la tabla. Ajusta la altura y la anchura de los datos de la tabla a las dimensiones de tu imagen.

Ejemplo: <table border="0" cellpadding="0" cellspacing="0"> <tr> <td width="500" height="500"></td> </tr> </table>


Paso 4

Añade background="ImageLink" en el código de los datos de la tabla. Cambia "imageLink" a la URL de tu imagen y manten las comillas. Esto establece la imagen como fondo para la tabla.

Ejemplo: <table border="0" cellpadding="0" cellspacing="0"> <tr> <td width="500" height="500" background="imagelink"></td> </tr> </table>


Paso 5

Elige un lugar para que el texto aparezca. El texto se mostrará en la parte inferior, superior o en el centro de la imagen. Añade valign="bottom" al código de los datos de la tabla para establecer el posicionamiento. "Valign" se refiere a la alineación vertical. Cambia "bottom" a "middle" o "top", en base a tu ubicación prevista.

Ejemplo: <table border="0" cellpadding="0" cellspacing="0"> <tr> <td width="500" height="500" background="imagelink" valign="bottom"></td> </tr> </table>


Paso 6

Escribe el texto que desees entre las etiquetas de apertura y cierre de los datos de la tabla.

Ejemplo: <table border="0" cellpadding="0" cellspacing="0"> <tr> <td width="500" height="500" background="imagelink" valign="bottom"> <font size="3" color="#FFFFFF">Texto</font> </td> </tr> </table>


Paso 7

Guarda el documento HTML. Haz una vista previa de la página en el navegador web antes de subirla a tu servidor.