Está en la página 1de 15
 Uno de los primeros cambios que realiza html en su version 5 es el recortar
  • Uno de los primeros cambios que realiza html en su version 5 es el recortar la declaracion de que es un archivo html. Anteriormente se escribia:

  • ! <DOCTYPE HTML PUBLIC "- //WC//DTDHTML4.01//EN"Http://www.w3.or

g/TR/html4/strict.dtd">

  • Ahora en cambio solo basta con declarar

  • <!DOCTYPE HTML>

 <!DOCTYPE HTML>  <html>  <head>  <title>Titulo del documento</title>  </head>   <body>

<!DOCTYPE HTML>

<html>

<head>

<title>Titulo del documento</title>

</head>

<body>

Contenido de la pagina

</body>

</html>

 HTML5 reemplaza el uso de <div> en los encabezados, secciones y pies de paginas por
  • HTML5 reemplaza el uso de <div> en los

encabezados, secciones y pies de paginas por

nuevas etiquetas que son de uso exclusivo

para estas partes, estas etiquetas son:

  • <header></header>

  • <nav></nav>

  • <section></section>

  • <aside></aside>

  • <footer></footer>

  • <html>

  • <head>

  • <title>Titulo del documento</title>

  • </head>

  • <body>

  • <header>Encabezado de la pagina</header>

  • <nav>Menu</nav> <article> <section>Contenido importante</section> </article>

  • <aside>Contenido no importante</aside>

  • <footer>Muestra el pie de pagina </footer>

  • </body>

  • </html>

 Quedando de manera visual de la siguiente manera. 
Quedando de manera visual de la siguiente
manera.
 Este nuevo elemento nos permite mostrar en nuestra pagina una consola para mostrar codigo, el

Este nuevo elemento nos permite mostrar en

nuestra pagina una consola para mostrar

codigo, el cual se mostrara el texto sin que

nuestro navegador lo complile. El usuario puede invocar este elemento al realizar algun

post.

<command>

lineas de codigo que queremos mostrar

</command>

 Este elemento sirve para mostrar/ocultar información. siempre se utiliza con el elemento <summary> que se
  • Este elemento sirve para mostrar/ocultar información. siempre se utiliza con el

elemento <summary> que se utiliza para mostrar el titulo de la información oculta.

  • <details>

  • <summary>Titulo a mostrar</summary>

  • Información oculta que se mostrara al hacer click en el titulo.

  • </details>

 El elemento <mark> nos sirve para remarcar texto en nuestra pagina, se muestra resaltado del
  • El elemento <mark> nos sirve para remarcar

texto en nuestra pagina, se muestra resaltado

del resto del texto.

  • Este texto esta normal.<mark> Se resalta el texto.</mark> Continua el texto normal

 Es similar a un select pero nos permite escribir y abajo en forma de lista
  • Es similar a un select pero nos permite escribir y

abajo en forma de lista nos aparecerán las

opciones que contengan ese texto.

  • <input list="browsers"> <datalist id="browsers"> <option value="Internet Explorer"> <option value="Firefox"> <option value="Chrome"> <option value="Opera">

<option value="Safari">

</datalist>

 Genera claves automáticamente dentro de nuestro formulario.  <form action="demo_keygen.php" method="post"> Username: <input type="text" name="usr_name">
  • Genera claves automáticamente dentro de

nuestro formulario.

  • <form action="demo_keygen.php" method="post"> Username: <input type="text" name="usr_name">

Encryption: <keygen name="security">

<input type="submit"> </form>

 Permite obtener el resultado de una operación en nuestro mismo formulario.  <form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0 <input
  • Permite obtener el resultado de una

operación en nuestro mismo formulario.

  • <form

oninput="x.value=parseInt(a.value)+parseInt(b.value)">0

<input type="range" id="a" value="50">100 +

<input type="number" id="b" value="50">= <output name="x" for="a b"></output> </form>

 color  date  datetime  datetime-local  email  month  number  range
  • color

  • date

  • datetime

  • datetime-local

  • email

  • month

  • number

  • range

  • search

  • tel

  • time

  • url

  • Week

  • password