2 2-HTML

Tecnicatura Universitaria en Desarrollo de Software
Programación 2
Módulo 2: Frontend
Tema 2: HTML
2.2. HTML
2.2. HTML
2.2.1. Etiquetas
2.2.1.1. Tabla de etiquetas HTML
2.2.2. Estructura
2.2.3. Listas
2.2.4. Formularios
2.2.4.1 Atributo action
2.2.4.2 Atributo target
2.2.4.3 Atributo method
2.2.4.4 Elementos del formulario
2.2.5. Tablas
2.2.6. Multimedia y Enlaces
2.2.7. Estilos
2.2. HTML
En este tema nos centraremos en el lenguaje HTML (HyperText Markup Language). HTML es
el lenguaje de marcado fundamental utilizado para estructurar y organizar el contenido de
una página web. Es la base sobre la cual construiremos nuestras interfaces.
Figura 2.6
HTML utiliza una serie de etiquetas para marcar y definir diferentes elementos en una
página web. Estas etiquetas son instrucciones que le dicen al navegador cómo debe
interpretar y mostrar el contenido.
Con el conocimiento de HTML, podremos crear páginas web estáticas, establecer la

estructura básica de nuestro sitio y prepararlo para añadir estilos y funcionalidades con CSS
y JavaScript.
2.2.1. Etiquetas
Un documento HTML está estructurado por elementos. Los elementos están encerrados con
parejas de etiquetas que realizan la apertura y el cierre.
Cada etiqueta empieza y termina por signos de mayor y menor (<>, </>) exceptuando algunas
como por ejemplo la etiqueta img.
Todas las etiquetas cuentan con una serie de atributos los cuales sirven para
añadir/complementar información o significado al elemento HTML al que estamos
colocando. Los atributos siempre se colocan dentro de la etiqueta de apertura, aquí un
ejemplo:
Figura 2.7
Las partes de una etiqueta son:
● La etiqueta de apertura: consiste en el nombre del elemento, encerrado entre

paréntesis angulares (<>) de apertura y cierre. Esta etiqueta de apertura marca dónde
comienza el elemento o comienza a tener efecto.
● Los atributos: contiene información extra sobre el elemento que no se mostrará en
el contenido.
● El contenido: Este es el contenido del elemento.
● La etiqueta de cierre: Es lo mismo que la etiqueta de apertura, excepto que incluye
una barra diagonal antes del nombre del elemento. Esto indica dónde termina el
elemento.
Las etiquetas se pueden anidar, ósea que las etiquetas pueden estar dentro de otras
etiquetas.
<p>Texto de <strong> ejemplo</strong></p>
2.2.1.1. Tabla de etiquetas HTML

Propiedad Utilidad
<!–…–> Define un comentario
<!DOCTYPE> Define el tipo de documento

<a> Define un hipervínculo
<article> Define un artículo
<aside> Define el contenido lateral del contenedor de una página
<audio> Define contenido de sonido
<b> Define texto en negrita
<body> Define el cuerpo del documento
<br> Define un salto de línea
<button> Define un botón clickeable
<canvas> Se usa para dibujar gráficos en pantalla
<col> Especifica las propiedades de la columna para cada columna del
elemento <colgroup>
<colgroup> Especifica un grupo de una o más columnas de una tabla
<datalist> Específica en un input una lista predefinida de opciones
<div> Define una sección en un documento
<em> Define énfasis en un texto
<embed> Define el contenedor de una aplicación externa (no html)
<fieldset> Grupo de elementos relacionados en un formulario
<figcaption> Define el título para una figura <figure>
<figure> Específica autocontenido
<footer> Define el pie de página de un documento
<form> Define un formulario html
<h1> a <h6> Define encabezados o títulos

<head> Define información acerca del documento
Propiedad Utilidad
<header> Define la sección de encabezado del documento
<hr> Define un cambio de temática a partir de una línea dibujada
<html> Define la raíz del documento
<i> Define una parte del texto de modo alternativo
<iframe> Define un frame en línea
<img> Define una imagen
<input> Define un control de entrada de texto
<label> Define el rótulo para un elemento <input>
<legend> Define un título para los elementos <fieldset>, <figure>,
<details>
<li> Define un ítem de una lista
<link> Define la relación entre un documento y un recurso externo
(generalmente con hojas de estilo)
<map> Define un mapa de imagen del cliente
<meta> Define un metadato de un documento
<nav> Define un link de navegación
<ol> Define una lista ordenada
<option> Define una opción en una lista desplegable
<p> Define un párrafo
<script> Define un script del lado cliente
<section> Define una sección de un documento
<select> Define un drop-down list
<small> Define texto pequeño
<source> Define los recursos para elementos multimedia
<span> Define una pequeña sección de un documento
<strong> Define un texto en negrita
<style> Define un estilo para la información de un documento
<sub> Define un texto que es subíndice
<table> Define una tabla
<tbody> Define el cuerpo de una tabla
Propiedad Utilidad
<td> Define una celda en una tabla
<textarea> Define un control de entrada de múltiples líneas
<tfoot> Agrupa los footer contenidos en una tabla
<th> Define una celda de encabezado en una tabla
<thead> Agrupa los encabezados de una tabla
<time> Define fecha / hora
<title> Define un título para el documento
<tr> Define una fila en una tabla
<ul> Define una lista desordenada
<video> Define un vídeo o película
2.2.2. Estructura
Una vez creado el documento HTML se nos presenta una estructura inicial formada por
etiquetas/elementos.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
Todo documento HTML empieza con la etiqueta DOCTYPE que indica que este documento
es de tipo HTML, está no tiene etiqueta de cierre.
Luego se encuentra la etiqueta html que engloba todo el documento.
La etiqueta head provee información general (metadatos) acerca del documento,

incluyendo su título y enlaces a scripts y hojas de estilos.
Y la etiqueta body en la que engloba el cuerpo de nuestra página y es lo que los usuarios
visualizan.
Los espacios no son significativos y la indentación solo sirve para mejorar la lectura.
Figura 2.8
Toda página HTML se divide a través de etiquetas de estructura.
Algunas de las etiquetas de estructura más comunes son:
• <div></div> En HTML, la etiqueta <div> es un contenedor genérico de bloque

para otros elementos. Es «genérico» porque no describe el contenido que
contiene.
• <header></header> Representa un grupo de ayudas introductorias o de

navegación. Puede contener algunos elementos de encabezado, así como
también un logo, un formulario de búsqueda, un nombre de autor y otros
componentes.
• <nav></nav> Representa una sección de una página cuyo propósito es

proporcionar enlaces de navegación, ya sea dentro del documento actual o a
otros documentos.
• <aside></aside> Representa una sección de una página que consiste en
contenido que está indirectamente relacionado con el contenido principal del
documento. Estas secciones son a menudo representadas como barras laterales
o como inserciones.
• <article></article> Representa una composición auto-contenida en un

documento, una página, una aplicación o en un sitio, que se quiere que sea
distribuible y/o reutilizable de manera independiente.
• <section></section> Representa una sección genérica de un documento.
• <footer></footer> Sirve para definir el pie de página.
Figura 2.9
El código del ejemplo:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<header></header>
<nav></nav>
<section>
<article></article>
<article></article>
<aside></aside>
</section>
</body>
</html>
2.2.3. Listas
Las listas se dividen en dos tipos:
Listas desordenadas:
• Elemento 1
• Elemento 2
• Elemento 3
• Elemento 4
Listas Ordenadas:
1. Elemento 1
2. Elemento 2
3. Elemento 3
4. Elemento 4
Las listas desordenadas empiezan con el elemento <ul> y dentro contienen elementos
<li>. Aquí un ejemplo:
<ul>
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ul>
Por otro lado, las listas ordenadas empiezan con el elemento <ol>, por ejemplo:
<ol>
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ol>
2.2.4. Formularios
Los formularios web son uno de los principales puntos de interacción entre un usuario y un
sitio web o aplicación.
Los formularios permiten a los usuarios la introducción de datos, que generalmente se

envían a un servidor web para su procesamiento y almacenamiento, o se usan en el lado del
cliente para provocar de alguna manera una actualización inmediata de la interfaz (por
ejemplo, se añade otro elemento a una lista, o se muestra u oculta una función de interfaz
de usuario).
Todos los formularios comienzan con un elemento <form> que engloba a todo el formulario.
<form>

</form>
2.2.4.1. Atributo action
El atributo action define la acción a realizar cuando se envía el formulario.
Por lo general, los datos del formulario se envían a un archivo en el servidor cuando el
usuario hace clic en el botón Enviar.
En el siguiente ejemplo, los datos del formulario se envían a un archivo llamado

“action_page.php”. Este archivo contiene un script del lado del servidor que maneja los
datos del formulario:
<form action="/action_page.php">
<label for="fname">Nombre</label><br>
<input type="text" id="fname" name="fname"><br>
<label for="lname">Apellido</label><br>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
2.2.4.2. Atributo target
El atributo target especifica dónde se muestra la respuesta que se recibe después de enviar
el formulario.
El atributo target puede tener uno de los siguientes valores:
Valor Definición
_blank La respuesta se muestra en una nueva ventana.
_self La respuesta se muestra en la ventana actual.
_parent La respuesta se muestra en el marco principal.
_top La respuesta se muestra en el cuerpo completo de la ventana.
El valor predeterminado es _self lo que significa que la respuesta se abrirá en la ventana

actual.
2.2.4.3. Atributo method
El atributo method especifica el método HTTP que se utilizará al enviar los datos del
formulario.
Los datos del formulario se pueden enviar como variables de URL (con method=“get”) o
como transacción posterior HTTP (con method=“post”).
El método HTTP predeterminado al enviar datos de formulario es GET.
<form method="get">
</form>
2.2.4.4. Elementos del formulario
El elemento <form> contiene una serie de elementos.
• <input>
• <label>
• <textarea>
• <button>
• <option>
• <select>
• <datalist>
El elemento <input> se usa para crear controles interactivos para formularios basados en
la web con el fin de recibir datos del usuario.
Hay disponible una amplia variedad de tipos de datos de entrada y widgets de control, que
dependen del dispositivo y el agente de usuario.
El elemento <input> es uno de los más potentes y complejos en todo HTML debido a la gran
cantidad de combinaciones de tipos y atributos de entrada.
Type es un atributo de <input> y puede tener los siguientes valores:
Valor Definición
text Crea un recuadro para insertar texto.
checkbox Crea una casilla de verificación, de opción múltiple
button Crea un botón el cual para definir el texto dentro de usamos el atributo
value=““.
color Crea un recuadro el cual nos permite seleccionar un color.
date Crea un recuadro para ingresar/seleccionar una fecha.
email Crea un campo para insertar una dirección de email.
file Permite subir archivos.
hidden Define un input invisible para el usuario.
number Crea un campo donde solo se puede insertar números.
radio Crea una casilla de opción, solo permite seleccionar una entre varias
opciones.
password Al igual que text crea un recuadro para insertar texto, pero este no es visible.
submit Define un botón para enviar los datos del formulario.
search Crea un campo similar a texto solo que la función de este es la búsqueda.
range Define una barra para seleccionar números donde por defecto va del 0 al 100
pero estos valores se pueden modificar con los atributos min=“” / max=““.
tel Crea un campo para ingresar un número telefónico.
time Crea un campo para ingresar alguna hora del día.
url Se utiliza para campos de entrada que deben contener una dirección URL.
Algunos de los atributos más importantes del elemento <input> son:
Atributo Definición
value Ingresa un valor por defecto al campo.
disabled Deshabilita el campo.
size Especifica el ancho visible, en caracteres, de un campo de entrada.
placeholder Indica una sugerencia breve que describe el valor esperado de un campo
de entrada.
required Indica que el campo es obligatorio llenarlo para enviar el formulario.
min Especifica un valor mínimo para un campo de entrada. Funciona en

(number, range, date, time).
max Especifica un valor máximo para un campo de entrada. Funciona en

(number, range, date, time).
height Se usa cuando el type=“image” y le determina una altura a la imagen.
width Se usa cuando el type=“image” y le determina el largo de la imagen.
El elemento <label> representa una etiqueta para un elemento en una interfaz de usuario.
Es una forma de indicar con texto de que se trata el campo que está visualizando. Por
ejemplo:
<form>
<label>Nombre: </label>
<input type="text">
</form>
Como podemos ver en el ejemplo el label indica que en el campo siguiente debe ingresar su
nombre y se visualiza de la siguiente manera:
Figura 2.10
El elemento <select> sirve para crear una lista con opciones. Las opciones van dentro de
etiquetas <option>.
<form>
<label>Selecciona un Nombre:</label>
<select>
<option>Renzo</option>
<option>Juan</option>
<option>Boti</option>
<option>Pedro</option>
</select>
</form>
El código se verá de la siguiente manera:
Figura 2.11
El elemento <textarea> es similar al input de tipo texto con la diferencia de que textarea
define un campo de entrada de varias líneas (un área de texto). Se le puede definir un
tamaño con los atributos col y rows:
<form>
<textarea rows="10" cols="30"></textarea>
</form>
Figura 2.12
El elemento <button> crea un botón.
<button>Click Me!</button>
2.2.5. Tablas
Las tablas en HTML permiten organizar información de manera tabular. Una tabla es un
conjunto estructurado de datos distribuidos en filas y columnas (datos tabulados). Una
tabla permite buscar con rapidez y facilidad valores entre diferentes tipos de datos que
indiquen algún tipo de relación.
Al igual que los formularios las tablas también están contenidas por un elemento, este
elemento se llama <table>, de esta manera le indicamos al documento que se trata de una
tabla.
Las tablas están conformadas por celdas que se denotan con la etiqueta/elemento <td>, las
celdas son las que contienen la información. Por ejemplo:
<table>
<tr>
<td>Info</td>
<td>Info2</td>
<td>Info3</td>
</tr>
</table>
Por otro lado, como podemos ver en el ejemplo anterior, también existen las filas que se
denotan con la etiqueta <tr>. Aquí un ejemplo de una tabla con 2 filas:
<table>
<tr>
<td>Juan</td>
<td>Pedro</td>
<td>Matias</td>
</tr>
<tr>
<td>23</td>
<td>32</td>
<td>5</td>
</tr>
</table>
Además de las celdas y filas, existen los encabezados de las tablas y se denotan con la
etiqueta <th>.
Por ejemplo:
<table>
<tr>
<th>Persona 1</th>
<th>Persona 2</th>
<th>Persona 3</th>
</tr>
<tr>
<td>Juan</td>
<td>Pedro</td>
<td>Matias</td>
</tr>
<tr>
<td>23</td>
<td>32</td>
<td>5</td>
</tr>
</table>
Los encabezados se distinguen de las celdas ya que son los que indican de qué trata la
columna.
Figura 2.13
2.2.6. Multimedia y Enlaces
En HTML se pueden agregar imágenes, videos, audios y gifs. Son recursos importantes que
pueden proporcionar no sólo una mejor apariencia sino también brindar más información sin
depender tanto de textos largos.
La etiqueta <img> sirve para agregar imágenes al documento. Esta etiqueta diferencia de
las demás no cuenta con una etiqueta de cierre ya que no es necesario agregar información
dentro de la misma, sino que lo haremos a través de los atributos de los que dispone. Aquí
un ejemplo:
<img src="" alt="">
Como podemos ver, la etiqueta img no contiene una etiqueta de cierre y al momento de
crearla aparecen dos atributos: src, cuyo valor indica la ubicación de la imagen, podría ser
un link o la dirección del archivo. Por otro lado, está el atributo alt cuyo valor es el texto que
se va a mostrar en caso de que la imagen no se encuentre o falle.
El elemento <img> tiene más atributos, pero los más importantes aparte de src y alt son los
atributos width y height que sirven para establecer un alto y un ancho a la imagen, por
ejemplo:
<div>
<img src="./img/logo.jpg" alt="logo" width="1200" height="700">
</div>
El elemento <video> se usa para insertar videos dentro del documento. Tiene una etiqueta
de cierre y va de la mano de otro elemento: <source>. El elemento source se utiliza para
especificar la ubicación del video y de qué tipo de archivo se trata (mp4, ogg, etc.).
Atributos del elemento <video>:
Atributo Utilidad
width Sirve para indicar el ancho en píxeles del video.
height Sirve para indicar el alto en píxeles del video.

autoplay Reproduce el video de manera automática apenas carga la página.
controls Activa los controles del video (Subir/Bajar Volumen, Pausar, Adelantar)
El elemento <source> no tiene una etiqueta de cierre y está contenida por el elemento
<video>. También cuenta con dos atributos importantes, src, que indica la ubicación del
video y type, que indica el formato del video. El formato se escribe especificando que es un
video y luego separado por una barra diagonal el formato del video ya sea mp4, ogg, etc.
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>
También podemos introducir audios a un documento HTML, para esto es necesario el

elemento <audio>. El elemento <audio> al igual que el elemento <video> engloba a un
elemento <source>.
Atributos del elemento <audio>:
Atributo Utilidad
muted Sirve para que el audio inicie, pero en silencio.
autoplay Reproduce el audio de manera automática apenas carga la página.
controls Agrega controles de audio, como reproducción, pausa y volumen.
Cabe aclarar que <source> tiene los mismos atributos dichos anteriormente, a diferencia
que esta vez en el atributo type especificaremos que el archivo es de tipo audio y el formato
correspondiente (mp3/wav/ogg).
<audio controls autoplay muted>
<source src="audio.mp3" type="audio/mp3">
</audio>
Los hipervínculos (o enlaces) son elementos verdaderamente importantes. Los

hipervínculos nos permiten vincular documentos a otros documentos o recursos, vincular a
partes específicas de documentos o hacer que las aplicaciones estén disponibles en una
dirección web.
Prácticamente cualquier contenido web se puede convertir en un enlace que, al pulsarlo

(activarlo), dirija el navegador a la dirección web a la que apunta el enlace (URL).
Los enlaces o hipervínculos se definen con la etiqueta <a> y su contenido es el texto que
sirve para la interacción con el enlace.
<a href="https://www.google.com/">Google</a>
Los enlaces tienen un atributo clave (href) que sirve para indicar la URL de algún sitio o para
navegar entre nuestros documentos. Por ejemplo:
<a href="./login.html">Login</a>
En el atributo href está especificada la ubicación de otro documento html. Para navegar
entre nuestras carpetas hasta llegar al archivo que queremos enlazar debemos empezar con
“./” esto quiere decir que estamos buscando en la misma carpeta. Si queremos salir un nivel
más arriba tenemos que agregar otro punto al principio, ósea “../”. Aquí un ejemplo:
Figura 2.14
Como podemos ver el archivo index.html (el archivo que estamos escribiendo) se encuentra
dentro de la carpeta main y en caso de querer enlazar index.html con contacto.html la
etiqueta quedaría de la siguiente manera.
<a href="../contacto.html">Contacto</a>
Con los dos puntos indicamos que queremos salir de la carpeta main y seleccionar un
archivo de afuera de la misma, en caso de querer seleccionar una carpeta aun anterior solo
haría falta otro punto “…/” y así tantas veces necesitemos.
Atributos del elemento <a>:
Atributo Utilidad
href Sirve para indicar la ubicación a la cual nos queremos dirigir ya sea archivo o
un enlace a un sitio externo.
title Contiene información adicional sobre el enlace, como qué tipo de información
contiene la página o cosas que debes tener en cuenta en el sitio web.
2.2.7. Estilos
En HTML hay 3 formas de agregar estilos:
• En línea: quiere decir que se definen los estilos dentro de la misma etiqueta o
elemento.
• Con el elemento <style>: quiere decir que se definen los estilos de cualquier otro
elemento, dentro del elemento <style>, el cual puede estar en cualquier parte del
documento HTML. Aunque normalmente, si se usa, se coloca al principio del
documento.
• Con un archivo externo: en este caso se usa uno o más archivos CSS externos que
contienen los estilos de los elementos que se usarán en el documento HTML.
Por ahora solo usaremos los estilos en línea.

Para definir un estilo en línea, hacemos uso del atributo style de esta forma:
<h1 style="color:green;">Titulo color verde</h1>
<p style="color:blue;">Párrafo color azul</p>
En el ejemplo podemos ver que el título y el párrafo cambian de color con la propiedad color.
Hay muchísimas propiedades para personalizar los elementos, pero por ahora solo veremos
los principales:
Propiedad Utilidad
color Cambia el color del texto, se puede poner el nombre del color o
el valor hexadecimal.
background-color Cambia el color de fondo o el color del contenedor.
text-aling Cambia la alineación del texto ya sea left, right, center, justify
font-family Cambia la fuente del texto

Bibliografía
1. https://developer.mozilla.org/es/
2. https://www.w3schools.com/css/default.asp
3. https://developer.mozilla.org/es/docs/Learn/Common_questions/Web_mechanics/
What_is_a_URL

2 2-HTML

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

2 2-HTML

Cargado por

Copyright:

Formatos disponibles

Tecnicatura Universitaria en Desarrollo de Software

2.2.1.1. Tabla de etiquetas HTML

2.2.4.1 Atributo action

2.2.4.2 Atributo target

2.2.4.3 Atributo method

2.2.4.4 Elementos del formulario

2.2.6. Multimedia y Enlaces

Con el conocimiento de HTML, podremos crear páginas web estáticas, establecer la

Las partes de una etiqueta son:

● La etiqueta de apertura: consiste en el nombre del elemento, encerrado entre

<p>Texto de <strong> ejemplo</strong></p>

2.2.1.1. Tabla de etiquetas HTML

<!–…–> Define un comentario

<!DOCTYPE> Define el tipo de documento

<h1> a <h6> Define encabezados o títulos

Luego se encuentra la etiqueta html que engloba todo el documento.

La etiqueta head provee información general (metadatos) acerca del documento,

Toda página HTML se divide a través de etiquetas de estructura.

Algunas de las etiquetas de estructura más comunes son:

• <div></div> En HTML, la etiqueta <div> es un contenedor genérico de bloque

• <header></header> Representa un grupo de ayudas introductorias o de

• <nav></nav> Representa una sección de una página cuyo propósito es

• <article></article> Representa una composición auto-contenida en un

• <section></section> Representa una sección genérica de un documento.

• <footer></footer> Sirve para definir el pie de página.

El código del ejemplo:

Las listas se dividen en dos tipos:

Los formularios permiten a los usuarios la introducción de datos, que generalmente se

2.2.4.1. Atributo action

El atributo action define la acción a realizar cuando se envía el formulario.

En el siguiente ejemplo, los datos del formulario se envían a un archivo llamado

<input type="text" id="fname" name="fname"><br>

<input type="text" id="lname" name="lname"><br><br>

<input type="submit" value="Submit">

El atributo target puede tener uno de los siguientes valores:

_blank La respuesta se muestra en una nueva ventana.

_self La respuesta se muestra en la ventana actual.

_parent La respuesta se muestra en el marco principal.

_top La respuesta se muestra en el cuerpo completo de la ventana.

El valor predeterminado es _self lo que significa que la respuesta se abrirá en la ventana

2.2.4.3. Atributo method

El método HTTP predeterminado al enviar datos de formulario es GET.

2.2.4.4. Elementos del formulario

El elemento <form> contiene una serie de elementos.

Type es un atributo de <input> y puede tener los siguientes valores:

text Crea un recuadro para insertar texto.

checkbox Crea una casilla de verificación, de opción múltiple

color Crea un recuadro el cual nos permite seleccionar un color.

date Crea un recuadro para ingresar/seleccionar una fecha.

email Crea un campo para insertar una dirección de email.

file Permite subir archivos.

hidden Define un input invisible para el usuario.

number Crea un campo donde solo se puede insertar números.

submit Define un botón para enviar los datos del formulario.

tel Crea un campo para ingresar un número telefónico.

time Crea un campo para ingresar alguna hora del día.

value Ingresa un valor por defecto al campo.

disabled Deshabilita el campo.

size Especifica el ancho visible, en caracteres, de un campo de entrada.

required Indica que el campo es obligatorio llenarlo para enviar el formulario.

min Especifica un valor mínimo para un campo de entrada. Funciona en

max Especifica un valor máximo para un campo de entrada. Funciona en

height Se usa cuando el type=“image” y le determina una altura a la imagen.