码迷,mamicode.com
首页 > Web开发 > 详细

HTML之学习笔记(十)表单元素

时间:2016-05-17 22:35:44      阅读:189      评论:0      收藏:0      [点我收藏+]

标签:

  html表单元素的基本格式为(必须包含在form标签中

技术分享

大致可以分为文本类按钮类复选框和单选框文件选择几类

1.文本类

  文本框标签<input type = “text“ />,属性size文本框的宽度、maxlength可输入的最大字节长度、readonly=“readonly”文本只读,无法修改
  密码框标签<input type = “password” />,在页面显示为黑色小圆点
  隐藏标签(隐藏域)<input type=“hidden” />,不会对页面显示有任何影响,常用于保存页面状态的值
  文本域标签<textarea></textarea>,属性rows和cols(column),用于显示用户输入多个数据文本,文本域中的数据会原始的输出(保留原有格式),可以使用value属性得到文本域中的数据。

2.按钮类

  提交按钮标签<input type=“submit” />
  重设按钮标签<input type=“reset” />,恢复页面的刚加载时的原始状态
  按钮标签<input type=“button”  onclick=“”/>,可以为点击按钮添加点击事件。
  图像标签<input type=“image” src=“URL” />,点击图片,将点击的位置坐标进行提交。

3.复选框、单选框和文件上传

  复选框标签<input type=“checkbox”  id=""/><label for=“id”>文本</label>,多个组合在一起的小方块,由用户进行多选,常用属性checked=“checked”默认选中,使用label标签将文字包起来,使用for属性关联到指定的checkbox的id
  单选按钮签<input type=“radio” />,使用时应注意,单选框总是几个组合在一起,要求都有相同的name属性,用属性checked=“checked”默认选中。设置value属性便于获得选中的数据。
  文件选择标签<input type=“file” />,form的enctype必须设置为multipart/form-data、method属性为POST

 1 <html> 
 2     <head>
 3         <title></title>
 4         <style type="text/css">
 5         </style>
 6         <script type="text/javascript">            
 7         </script>
 8     </head>
 9     <body>    
10         <form>
11                 复选:<br />
12             <input type="checkbox" id="item1" /><label for="item1">选项一</label>
13             <input type="checkbox" id="item2" /><label for="item2">选项二</label>
14             <input type="checkbox" id="item3" /><label for="item3">选项三</label>
15             
16             <br/>你的性别是:
17             <input type="radio" name="sex" value="m" checked="checked"/>18             <input type="radio" name="sex" value="f" />19         </form>    
20     </body>
21 </html>

运行结果

技术分享

HTML之学习笔记(十)表单元素

标签:

原文地址:http://www.cnblogs.com/zk-ljc/p/5503311.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!