黑马程序员--HTML基础标签
2012-04-07 15:01
351 查看
---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流! ---------------------- ----------------------
1. <input>标签
<input> 标签用于搜集用户信息。
根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
type属性如下:type=
text:文本区域
password:密码域
checkbox:复选框,属性:checked:表示已选中
radio:单选框,属性name划分为同一个区域
file:选择文件
hidden:隐藏字段
button:普通的按钮
submit:提交按钮
reset:重置按钮
常用的属性:
accept:规定文件上传提交的文件类型.
alt:定义图像输入时替代的文本,比如浏览器设置关闭图片时,图片的位置就显示alt的文本。
align:规定图像输入的对齐方式.
name:定义input元素的名称
size:规定输入字段的长度.
maxlength:规定输入字符的最长字符长度.
readonly:规定输入的字段为只读
value:规定input元素的值.
2. <select>标签
select 元素可创建单选或多选菜单。类似于winform的combox或listbox
当提交表单时,浏览器会提交选定的项目,或者收集用逗号分隔的多个选项,将其合成一个单独的参数列表,并且在将 <select> 表单数据提交给服务器时包括 name 属性。
optgroup:类别,不能被选中
option:选中的类别
属性
size:当大于1时,就是listbox 否则就是combox
disabled:规定禁用下来列表.
multiple:规定是否可选择多个项目.
name:规定下拉列表的名称,并不是<option>name</option>里的。
[b]3. <textarea>标签
[/b]
textarea:文本区域,
<textarea> 标签定义多行的文本输入控件。
文本区中可容纳无限数量的文本,其中的文本的默认字体是等宽字体(通常是 Courier)。
可以通过 cols 和 rows 属性来规定 textarea 的尺寸,不过更好的办法是使用 CSS 的 height 和 width 属性。
属性:rows表示显示的行数,cols表示显示的列数
4. <label>标签
<label> 标签为 input 元素定义标注(标记)。
label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。
<label> 标签的 for 属性应当与相关元素的 id 属性相同。
当点击前面的label标签(姓名或密码)上时。就自动焦点到for属性指定的id上。
5. <fieldset>标签
类似于gropBox控件
当一组表单元素放到 <fieldset> 标签内时,浏览器会以特殊方式来显示它们,它们可能有特殊的边界、3D 效果,或者甚至可创建一个子表单来处理这些元素。
legend属性:定义元素的标题
----------------------------------------------------------------------------属性 name 与 id 的区别---------------------------------------------------------------
name属性在页面中可以不是唯一,id必须是唯一。
---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流! ----------------------
1. <input>标签
<input> 标签用于搜集用户信息。
根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
type属性如下:type=
text:文本区域
password:密码域
checkbox:复选框,属性:checked:表示已选中
radio:单选框,属性name划分为同一个区域
file:选择文件
hidden:隐藏字段
button:普通的按钮
submit:提交按钮
reset:重置按钮
常用的属性:
accept:规定文件上传提交的文件类型.
alt:定义图像输入时替代的文本,比如浏览器设置关闭图片时,图片的位置就显示alt的文本。
align:规定图像输入的对齐方式.
name:定义input元素的名称
size:规定输入字段的长度.
maxlength:规定输入字符的最长字符长度.
readonly:规定输入的字段为只读
value:规定input元素的值.
2. <select>标签
select 元素可创建单选或多选菜单。类似于winform的combox或listbox
当提交表单时,浏览器会提交选定的项目,或者收集用逗号分隔的多个选项,将其合成一个单独的参数列表,并且在将 <select> 表单数据提交给服务器时包括 name 属性。
optgroup:类别,不能被选中
option:选中的类别
<select size="6"> <optgroup label="省份"></optgroup> <option>江苏</option> <option>浙江</option> <optgroup label="直辖市"></optgroup> <option>北京</option> <option>上海</option> </select>
属性
size:当大于1时,就是listbox 否则就是combox
disabled:规定禁用下来列表.
multiple:规定是否可选择多个项目.
name:规定下拉列表的名称,并不是<option>name</option>里的。
[b]3. <textarea>标签
[/b]
textarea:文本区域,
<textarea> 标签定义多行的文本输入控件。
文本区中可容纳无限数量的文本,其中的文本的默认字体是等宽字体(通常是 Courier)。
可以通过 cols 和 rows 属性来规定 textarea 的尺寸,不过更好的办法是使用 CSS 的 height 和 width 属性。
属性:rows表示显示的行数,cols表示显示的列数
4. <label>标签
<label> 标签为 input 元素定义标注(标记)。
label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。
<label> 标签的 for 属性应当与相关元素的 id 属性相同。
<table> <tr> <td><label for="name">姓名:</label></td> <td><input type="text" id="name" /></td> </tr> <tr> <td><label for="ps">密码:</label></td> <td><input type="password" id="ps" /></td> </tr> </table>
当点击前面的label标签(姓名或密码)上时。就自动焦点到for属性指定的id上。
5. <fieldset>标签
类似于gropBox控件
当一组表单元素放到 <fieldset> 标签内时,浏览器会以特殊方式来显示它们,它们可能有特殊的边界、3D 效果,或者甚至可创建一个子表单来处理这些元素。
legend属性:定义元素的标题
<fieldset> <legend>性别</legend> <input type="radio" name="sex" />男 <input type="radio" name="sex" />女 </fieldset>
----------------------------------------------------------------------------属性 name 与 id 的区别---------------------------------------------------------------
name属性在页面中可以不是唯一,id必须是唯一。
---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流! ----------------------
相关文章推荐
- HTML基础 pre标签编辑的时候什么格式,显示的时候就什么格式
- 前端基础之html常用标签
- 黑马程序员_基础html css 学习(二)
- HTML-基础及一般标签
- 黑马程序员 HTML基础
- HTML基础 table标签cellpadding属性设置单元格中的文本与单元格的距离
- html基础(标签换成了《》)
- html_01之基础标签
- HTML系列之基础标签(一)
- 黑马程序员__html基础3
- HTML学习之网页制作基础和常用标签及标签属性
- 黑马程序员_Html常用标签
- HTML 基础标签demo
- HTML基础标签
- HTML&CSS基础学习笔记1.24-input标签重置表单
- html基础--body内部标签
- Web编程基础--HTML、CSS、JavaScript 学习之课程作业“仿360极速浏览器新标签页”
- Java基础第二阶段——01_JavaWeb_html&标签
- html系统学习之一<基础知识,标签,元素>
- HTML基础及常用标签