html5 input 标签

浏览数：29 / 时间：2015年06月09日

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4     <meta http-equiv="content-type" content="text/html" />
 5     <meta name="author" content="Prince" />
 6 
 7     <title>form</title>
 8 </head>
 9 
10 <body>
11     <form action="http://localhost/test.php" method="post" id="register"></form>
12     <input type="text" name="user" value="" form="register"/>
13     <input type="password" name="pwd" value="" form="register" />
14     <select name="year" form="register">
15         <option value="1970">1970</option>  
16         <option value="1980">1980</option>    
17         <option value="1990">1990</option>      
18     </select>
19     <input type="submit" value="注册" form="register"/>
20     
21     <hr />
22     dfd：<input type="text" name="tt" pattern="\d{3}" value="" form="register"/>
23     
24     邮箱：<input type="email" name="youxinag" value="" placeholder="这是默认值" autofocus="autofocus" form="register" required="required" /><br />
25     地址：<input type="url" name="url" form="register"  form="register"/>
26     DATE:<input type="date" name="riqi" value="" form="register"/><br />
27     TIME:<input type="time" name="shijian" value=""/> 
28     MONTH:<input type="month" name="yue" value="" />
29     周：<input type="week" name="zhou" value="" />
30     数字：<input type="number" name="suzhi" value="" form="register" /><br />
31     滑动条<input type="range" name="suzhi" value="" form="register"  max="10" step="2"/>
32     搜索 :<input type="search" name="huadong" value="" form="register" results="n"/>
33     颜色：<input type="color" name="huadong" form="register"/><br />
34     
35     <hr />
36     自动填充表单<br/>
37     <input type="text" name="auto" value="" list="movie" />
38     <datalist id="movie">
39         <option>人生的美好</option>
40         <option>人的高兴</option>
41         <option>太开心了</option>
42     </datalist>
43     <hr />
44     输出表单output
45     <form action="" method="post" oninput="result.value=parseInt(no1.value*no2.value)">
46         <input type="number" name="no1" value=""/>
47         <input type="number" name="no2" value=""/>
48         <output name="result" ></output>
49     </form>
50     <hr />

View Code

今天学生了html5的第一课一些常用的input 感谢网友

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4     <meta http-equiv="content-type" content="text/html" />
 5     <meta name="author" content="Prince" />
 6     
 7     <title>video</title>
 8 </head>
 9 
10 <body>
11     <video src="movie.ogg" width="500" height="500" controls="controls">
12         您的浏览器不支持
13     </video>
14     
15     <hr />
16     多资料的视频播放
17     <video controls="controls"  loop="loop" poster="PLMM.jpg">
18          
19         <source src="movie.ogg" type="Vieo/ogg"/>
20         <source src="movie.webm" type="Video/webm"/>
21         您的浏览器不支持视频标签，还不赶快升级
22     </video>
23     
24     <hr />
25     
26     使用以下Video标签的API<br />
27     <video src="movie.webm" id="video" controls="controls">
28         您的浏览器不支持
29     </video>
30     
31     <button onclick="bofang()">播放</button>
32     <button onclick="zanting()">暂停</button>
33     
34    
35     <script>
36         //获得对应的video标签
37         var videmo=document.getElementById(‘video‘);
38         
39         function bofang()
40         {
41             videmo.play();
42         }
43         
44         function zanting()
45         {
46             videmo.pause();   
47         }
48         
49         
50         
51     </script>
52     <hr />
53     音频标签的使用<br />
54     <audio src="我的好兄弟.mp3" controls="controls">
55         您的老牛已经接不动破车了
56     </audio>
57     
58     
59 </body>
60 </html>