3 4 5 文本框 6 7 8
当前位置:   article > 正文

h5-文本框

h5制作文本框

h5-文本框

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4   <meta charset="UTF-8">
 5   <title>文本框</title>
 6 </head>
 7 <body>
 8 <!-- form是表单,内部可以包含多个控件,
 9      控件内可以输入值。
10      我们是以表单为单元进行提交,一次要提交一个表单所包含所有控件的值。
11      表单只是用来定提交的范围。
12      表单是透明的。
13      #:表示无处可提交。在有服务器时可提交给服务器,即是填入服务器地址取代#。
14  -->
15 <form action="#">
16     <p>
17         <!-- 加标签:
18              在input里加入属性id,并起名“account”,设置文本框的唯一id,
19              而后,在“账号:”前加上lable for="文本框的id"来捆绑标签
20              从而实现,点击文字“账号:”也可以进行文本框输入。
21          -->
22         <label for="account">账号:</label>
23         <input type="texts" id="account"/>
24     </p>
25     <p>
26         <label for="password">密码:</label>
27         <input type="pwd" id="password"/>
28     </p>
29     <!-- 单选框:在input里添加属性name,让选项使用同名
30         互相排斥,即可实现单选
31     -->
32     <p>
33         性别:
34         <input type="radio" checked id="male" name="sex"/>
35         <label for="male"></label>
36         <input type="radio" id="female" name="sex"/>
37         <label for="female"></label>
38     </p>
39     <p>
40         兴趣:
41         <input type="checkbox" checked id="basketball">
42         <label for="basketball">篮球</label>
43         <input type="checkbox" id="football">
44         <label for="football">足球</label>
45     </p>
46     <p>
47         <!-- value:按钮的名称;button:需用js进行定义 -->
48         <input type="submit" value="提交"/>
49         <input type="reset" value="重置"/>
50         <input type="button" value="取消"/>
51     </p>
52 </form>
53 </body>
54 </html>

 补充部分功能:

1     <!-- 文件选择提交框 -->
2     <label for="attachment">上传附件:</label>
3     <input type="file" id="attachment"/>
4     <!-- 文本域:大号文本框 -->
5     <p><label for="disc">自我介绍:</label></p>
6         <textarea id="disc"></textarea>

 补充:

1 <!-- 下拉选择 -->
2     <label for="choseone">选择你要学习的课程:</label>
3     <select id="choseone">
4         <option>-请选择-</option>
5         <option value="1">html5</option>
6         <option value="2">js</option>
7         <option value="3">css</option>
8     </select>

 

转载于:https://www.cnblogs.com/DeRozan/p/7346517.html

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/321526
推荐阅读
相关标签
  

闽ICP备14008679号