jueves, 6 de abril de 2017

html 5

<!doctype HTML>

<html lang=es>
<meta name="decription" content="Curso de HTMl 5">
<meta name="author" content"Valeria Acevedo">
<meta charset="utf-8"/>
<h1>MI PRIMERA PAGINA WEB EN HTML 5</h1>
</head>
<body>
HTML5 (HyperText Markup Language, version 5) es la quinta vercion del lenguaje del
Lenguaje de marcado HTML que nace de las necesidades de la Web se va acercando mas
a los usuaros. HTML5 no constituye una revolucion sino una evolucion de lo que ya
existia para adoptarlo a las necesidades actuales y, sobretodo pensando en el futuro.
</body>
</html>

FORMULARIOS EN HTML 5 ATRIBUTOS Y ELEMENTOS
La etiqueta <input> especifica un campo de entrada donde el usuario puede introducir datos. en html5 vemos que tiene varios tipos de entrada o<input>.Estas nuevas caracteristicas permiten un mejor control de entrada y validacion.Ejemplos,tenemos:

<input type=text>:especifica que el usuario debe de llenar el campo con texto.

<input type=email>:especifica que el usuario debe de llenar el campo con un email valido.

<input type=url>:especifica que el usuario debe de llenar el campo con url.

<input type=colorl>:especifica que el usuario debe de llenar el campo con un color.

<input type=date>:especifica que el usuario debe de llenar el campo con una fecha

<input type=month>:especifica que el usuario debe de llenar el campo con unos de los meses.

ATRIBUTOS

1-EL ATRIBUTO AUTOCOMPLETE
El atributo autocomplete especifica si un campo de formulario o de entrada debe tener autocompletado de encendido o apagado , es decir On o Off.

<form action="form.php" autocomplete="on">
nombre:<input type="text" name ="fname" /><br />
apellido:<input type="text" name="1name" /><br />
e-mail: <input type="email" name="email" autocomplete="off" /><br />
<input type="submit" />
</form>

2-EL ATRIBUTO MULTIPLE
El atributo multiple especifica que el usuario puede introducir mas de un valor en el elemento <input>.Ej:<input type=email multiples> permite al usuario introducir varios direcciones de correo electronico.

<input type="file" name="img" multiple ="multiple" /><br />
entre varios email:<input type="email" multiple="multiple">

3-EL ATRIBUTO REQUIRED
El atributo required o requerido en un elemento se establece en un <input> ,y automaticamente hace que el usuario se vea obligado a llenar el campo para continuar , es decir el navegador no permitira que se envie la forma sin que el input con ete atributo este vacio.

<form action="demo_form. asp">
nombre: <input type="text" name="name" required="requered" />
<input type="submit" />
</form>

4-EL ATRIBUTO MIN AND MAX
El atributo min and max o minimo y maximo nos hace verificar el valor minimo y maximo para un elemento <input>.

escoja de 1 a 5:<input type="number" name="quantity" min="1"max="5" />
el atributo min and max finciona con los siguientes tipos de entrada:number,range,date,detetime -local,time and week.


Encuesta:

<!DOCTYPE HTML>
<html lang="es">
<head>
   <title>contenido editable</title>
</head>

<body>
buscar...:<input type="search" name="buscador">
<br><br>
Telefono: <input type="tel" name="telefono">
<br><br>
mail.....:<input type="email" name="correo">
<br><br>
Edad.....:<input type="number" name="num" min="0" max="50">
<br><br>
<label>selecciona tu pais:</label>
<input type="text" name="pais" id="pais" list="paises"/>
<datalist id="paises">
<option value="Argentina/">
<option value="Bolivia/">
<option value="Brasil/">
<option value="Chile/">
<option value="Colombia/">
<option value="Otro pais/">
<detalist/>

<br>
<br>
<form onsubmit="return false" oninput="res.value =parseInt(op1.value)*parseInt(op2.value)>
    <input name="op1" type="number" step="any"> x
    <input name="op2" type="number" step="any"> x
    <output name="res" for "op1 op2"></output>

</form>
<h2>texto no editable</h2>
<section id="editable" contenteditable="true">
<h3>este titulo si es editable</h3>
<p>Al igual que este parrafo</p>
<ul>
<liitem 1</li>
<liitem 2</li>
<liitem 3</li>
<liitem 4</li>
<liitem 5</li>
</ul>
</section>
</body>
</html>