Ejemplos de HTML

Un listado completo de los ejemplos más relevantes de Virtualnauta.


Ejemplos de HTML

Los ejemplos estan clasificados por temas y a su vez por los distintos elementos del lenguaje.

Si desea más ejemplos con diferentes variantes o valores puede dirigirse al enlace que se encuentra al final de cada sección.

Etiquetas Básicas Formato de Texto
Enlaces - Links Formularios
Imágenes Frames - Marcos
Tablas Listas


Etiquetas Básicas

Etiquetas Descripción Ej
<h1>...<h6> Títulos de diferentes tamaños. Ejemplo de las etiquetas <h1> a la <h6>
<p> Escribir un párrafo. Ejemplo del uso de la etiqueta <p> </p>
<!--> Poner un comentario en el código. Ejemplo del uso de los comentarios en un código HTML
<br> Para hacer un salto de línea. Ejemplo del uso de un salto de línea dentro del código HTML
<hr> Dibujar una línea horizontal. Ejemplo de como definir una línea horizontal dentro del código

Si deseas profundizar en el tema de etiquetas básicas, dirígete a HTML Etiquetas Básicas


Formatos de texto

Etiquetas Descripción Ej
<b> Texto en negrita. Ejemplo
<big> Texto grande. Ejemplo
<em> Texto enfatizado. Ejemplo
<i> Texto en itálica. Ejemplo
<small> Texto pequeño. Ejemplo
<strong> Texto fuerte. Ejemplo
<sub> Texto por debajo. Ejemplo
<sup> Texto por encima. Ejemplo
<ins> Texto subrayado. Ejemplo
<del> Texto tachado. Ejemplo
<tt> Texto teletipo. Ejemplo

Si deseas profundizar en el tema de formatos de texto, dirígete a HTML Formato de texto


Enlaces - Links

Etiquetas Descripción Ej
<a> Crear un vínculo simple. Ejemplo del uso del atributo href
Marcapáginas de un documento. Ejemplo para definir un enlace a una ubicación determinada de la página
Abrir un vínculo en una nueva ventana. Ejemplo que muestra como abrir un enlace en una nueva ventana
Abrir un vínculo en el frameset padre. Ejemplo que muestra como abrir un enlace en un frameset padre
Abrir un vínculo en el mismo frame. Ejemplo que muestra como abrir un enlace en el mismo frame donde fue apretado
Abrir un vínculo en una ventana de tamaño completo. Ejemplo que muestra como abrir un enlace en una ventana de tamaño completo

Si deseas profundizar en el tema de vínculos, dirígete a HTML Enlaces


Formularios

Etiquetas Descripción Ej
<form> Crear un formulario simple. Ejemplo del uso del atributo action en el formulario
La respuesta al formulario se abrirá en una nueva ventana. Ejemplo que abrirá una nueva ventana al enviar el formulario
La respuesta al formulario se abrirá en el mismo frame del formulario. Ejemplo que mostrará en el mismo frame los resultados, al enviar el formulario
La respuesta al formulario se abrirá en el frameset padre. Ejemplo que mostrará los resultados en el frame padre al enviar el formulario
La respuesta al formulario se abrirá en una ventana de tamaño completo. Ejemplo que mostrará los resultados en una ventana de tamaño completo al enviar el formulario
<input> Usar un botón gráfico para mandar los formularios. Ejemplo mostrando un botón de enviar alinéado a la izquierda
Un formulario tipo checkbox. Ejemplo de un formulario checkbox
Un formulario para subir archivos. Ejemplo de un formulario para enviar archivos
Un formulario con datos ocultos. Ejemplo de un formulario con un dato oculto
Un formulario con un botón personalizado con una imagen. Ejemplo de un formulario con un botón imagen en lugar del botón submit
Un formulario con ingreso de password. Ejemplo de un formulario con un campo de ingreso de un password
Un formulario del tipo radio. Ejemplo de un formulario radio
<fieldset> Dibujar un recuadro alrededor del formulario con un título. Ejemplo de como dibujar un recuadro alrededor del formulario
<select> Menú desplegable. Ejemplo del uso del atributo name en un menú desplegable
<optgroup> Poner subtítulos dentro del menú desplegable. Ejemplo de como definir rótulos dentro de un menú desplegable

Si deseas profundizar en el tema de formularios, dirígete a HTML Formularios


Imágenes

Etiquetas Descripción Ej
<img> Colocar una imagen en el documento. Ejemplo básico de como insertar una imagen
Modificar las medidas de una imagen. Ejemplo de como definir la altura de una imagen en pixels
Crear un mapa de una imagen. Ejemplo de como definir un mapa de una imagen

Si deseas profundizar en el tema de imágenes, dirígete a HTML Imágenes


Frames - Marcos

Etiquetas Descripción Ej
<frameset> Definir marcos verticales. Ejemplo que divide una página en columnas por pixels
Definir marcos horizontales. Ejemplo que divide una página en filas por pixels
<frame> División de marcos sin bordes. Ejemplo del atributo frameborder sin el borde alrededor
Uso de márgenes dentro de los marcos. Ejemplo que deja un margen inferior y superior en el frame
Marcos fijos que no permiten cambiar su tamaño. Ejemplo que define un frame que no puede ser modificado
Uso de la barra de desplazamiento dentro de los marcos. Ejemplo que muestra el comportamiento de la barra de desplazamiento
<noframes> En caso que el navegador del usuario no soporte marcos. Ejemplo mostrando el uso de noframes para navegadores que no soportan frames
<iframe> Alinéamos un iframe a la derecha de la página. Ejemplo que alínea el iframe a la derecha
Mostrar un iframe sín los bordes. Ejemplo que oculta el borde alrededor del iframe
Definir la altura del iframe a nuestro gusto. Ejemplo que define la altura del iframe en pixels
Definir el ancho del iframe. Ejemplo que define el ancho del iframe en porcentaje
Mostrar un iframe sín las barras de desplazamiento. Ejemplo que deshabilita la barra de desplazamiento para el iframe

Si deseas profundizar en el tema de marcos, dirígete a HTML Frames


Tablas

Etiquetas Descripción Ej
<table> Definir el espesor del borde de una tabla. Ejemplo que define el borde exterior de la tabla
Tamaño del relleno de cada celda de la tabla. Ejemplo que define el espacio entre contenido y borde de celda en pixels
Separación entre celdas de una tabla. Ejemplo que define el espacio entre diferentes celdas en pixels
Especificar los bordes que serán visibles de la tabla. Ejemplo que muestra todas las líneas horizontales de la tabla
Visualizar solo las líneas horizontales de una tabla. Ejemplo que muestra solo las líneas horizontales de una tabla
Especificar el ancho de la tabla. Ejemplo que especifica el ancho de la tabla en porcentajes
<tr> Alinear horizontalmente el contenido de las celdas de una fila. Ejemplo que compara los diferentes tipos de alineación dentro de las celdas
Alinear verticalmente el contenido de las celdas de una fila. Ejemplo que compara los diferentes tipos de alineación vertical dentro de las celdas
<td> Alinear horizontalmente el contenido de una celda. Ejemplo que compara los diferentes tipos de alineación horizontal dentro de las celdas
Alinear verticalmente el contenido de una celda. Ejemplo que compara los diferentes tipos de alineación vertical dentro de las celdas
Agrupamos un número de celdas horizontalmente. Ejemplo que muestra como anexar celdas horizontalmente
Agrupamos un número de celdas verticalmente. Ejemplo que muestra como anexar celdas entre sí verticalmente

Si deseas profundizar en el tema de tablas, dirígete a HTML Tablas


Listas

Etiquetas Descripción Ej
<ol> Hacer una lista ordenada. Ejemplo de como definir una lista ordenada números o letras
<ul> Hacer una lista sín orden alguno. Ejemplo de como definir una lista remarcada con puntos o símbolos
<dl> Hacer una lista descriptiva. Ejemplo de como se define una lista de definición

Si deseas profundizar en el tema de listas, dirígete a HTML Listas



<<< Tipos de Servidores Web Examen de HTML >>>

Alojamiento Web

¡OFERTA ESPECIAL! . COM SOLO $ 7.99 * por año. ¡Registrarse suyo hoy y por varios años!