H5 forms of learning

<html>

<head>
<title> new input types and form new element </ title>
<Meta charset = "UTF-. 8">
</ head>

<body>
<-! new types listed part of the INPUT ->

<form action = "">
Choose your favorite color: <input type = "color" name = "favcolor">
birthday: <input type = "date" name = "bday">
Birthday (date and time): <input type = "datetime" name = " bdaytime">
birth (date and time): <INPUT type = "datetime-local" name = "bdaytime">
E-mail: <INPUT type = "In Email" name = "In Email">
birth (month and year): <input type = "month " name = "bdaymonth">
number (from 1 to 5): <input type = " number" name = "quantity" min = "1" max = "5 ">
phone number: <input type =" tel " name =" usrtel ">
Add your home page: <the INPUT of the type =" url "name =" Homepage ">
</ form>

<-! Form new elements not all browsers support HTML5
new form elements, but you can use them
, even if the browser does not support form properties can still be displayed
as a conventional form elements. ->

<!-- datalist
与select区别
1.能模糊搜索
2.可由用户输入
-->
<input list="browser" name="browser">
<datalist id="browser">
<option value="ie"></option>
<option value="safari"></option>
<option value="opera"></option>
<option value="firefox"></option>
</datalist>

<-! Keygen
provide a reliable method for verifying the user
when the form is submitted, it generates two keys, a private key, a public key.
->
<form Action = "" Method, = "GET">
User Name: <input type = "text" name = "usr_name">
Encryption: <keygen name = "Security">
<= the INPUT of the type "the Submit">
< / form>

<!-- output
用于不同类型的输出
-->
<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>
</body>

</html>

Guess you like

Origin www.cnblogs.com/angle-xiu/p/11204473.html