i
Esta etiqueta HTML ha sido utilizada comúnmente para hacer que un texto concreto pase a la llamada letra cursiva o itálica, pero ahora, se emplean las hojas de estilos para formatear las fuentes y el tag i, ha quedado relegado a un uso en caso de que no exita otro que represente mejor lo que queremos definir o para cuando se quiere destacar un tecnicismo o un nombre.
iframe
Este tag es un contenedor que nos permite cargar otra página web en una parte de la nuestra. Esta etiqueta conlleva ciertos riesgos de seguridad, ya que estamos cargando contenido ajeno al nuestro que no podemos controlar.
Atributos importantes:
src. Define la fuente en la que se encuentra la web que va a contener el iframe.-
width y heigth. Definen la dimensiones del marco contenedor que mostrará la web incluida en el atributo src.
srcdoc. Nos permite definir codigo HTML como fuente a mostrar en un iframe en lugar de un link a otra web.
img
Permite la inserción de imágenes de múltiples formatos en la web, como jpg, gif, png, etc. Este tag a penas tiene cambios con respecto a HTML 4. Únicamente, han sido eliminados aquellos atributos que se habían quedado obsoletos en favor de las hojas de estilos como los referentes a al alineación o los bordes.
Atributos importantes: src, width, height, alt, que nos permiten indicar la ruta y las dimensiones de la imagne. Ademas, el atributo alt, nos permite fijar un título descriptivo que nos aparecerá con un tooltip al situarnos sobre ella con el ratón.
input
Este elemento se utiliza para definir un campo dentro de un formulario. Se pueden definir diversos tipos de campo con este tag, como botones de envío, campos de texto, checkboxes, etc.
Atributos importantes:
type. Nos pemrite definir el tipo de campo (texto, radio button, checkbox, etc). A continuación se describen algunos de los nuevos tipos que se han incluido en HTML 5:
- email: nos sirve para introducir direcciones de email
- url: para direcciones de páginas web
- number: para la introducción de números
- tel: para números de teléfono
- search: para campos de búsqueda
- search: para campos de búsqueda
- datetime: para seleccionar fecha y hora
- date: para seleccionar una fecha
- month: para seleccionar un mes
- week: para seleccionar una semana
- time: para seleccionar una hora
- datetime-local: para seleccionar una fecha y una hora sin zona horaria
- range: para seleccionar entre un rango de valores
- color: para seleccionar un color en valor hexadecimal
value. Define el valor inicial que tendrá ese campo. Generalmente se suele dejar vacío, pero si se debe poner un valor inicial, ha de tenerse en cuenta que éste cambiará según el tipo de campo. Por ejemplo ara los tipo texto, el valor será una cadena de caracteres, mientras que para los tipo radio buttons será un número.
Atributos nuevos:
Autocomplete. Define si un campo tendrá la opción de mostrar texto de ayuda mientras el usuario está escribiendo.
autofocus. Establece si un campo debe estar marcado o no de forma automática, de tal forma que por ejemplo en un campo de texto, el cursor se sitúe sobre él, y se pueda escribir directamente sin necesidad de seleccionarlo con el ratón.
placeholder. Nos muestra un texto de ejemplo dentro de la caja de texto que desaparece cuando hacemos foco en él.
required. Nos indica que ese campo no puede ser enviado vacío, y debe cumplir las especificaciones del tipo de campo que sea, por ejemplo, en un campo tipo email debemos introducir una dirección de correo válida.
pattern. Expresión regular que debe coincidir con el valor correcto que queremos que introduzca el usuario.
maxlength. En los textareas ahora podemos utilizar este atributo para limitar el número máximo de caracteres introducidos.
form. Permite que un input pueda pertenecer a varios formularios a al vez.
formaction, formectype, formmethod y formtarget. Estos atributos nos permiten definir la url procesará el campo del formulario cuando se envíe, el tipo de datos que se van a transmitir por dicho formulario, o el método de envió que se va a usar en el protocolo http (get o post) para su envío, así como la url a la que nos redirigirá despues del mismo. Estos atributos solo son validos para los tipos de campo “submit” e “image”.
width y height. Definen las dimensiones del campo de un formulario en el caso de que éste sea del tipo “image”.
list. Nos permite hacer referencia a un tag datalist para establecer valores predeterminados que se mostrarán mientras el usuario rellena el campo.
max y min. Definen el máximo y el mínimo valor para un campo.
step. Con este atributo podemos establecer los valores que se pueden introducir en un campo de tipo numérico.
Este elemento se utiliza para definir un campo dentro de un formulario. Se pueden definir diversos tipos de campo con este tag, como botones de envío, campos de texto, checkboxes, etc.
<input type="text" value="Cuartel de la Guardia Civil de Cartagena." />
<input type="number" step="2" />
