CSS选择框、下拉列表、文本域、表格
来源:互联网 发布:数据多样性 ppt 编辑:程序博客网 时间:2024/05/17 01:15
1.文件选择框
<input type="file"accept="image/*>
accept:指定可选择文件的类型。
上传的头像需指定对应表单的属性
<formenctype="multipart/form-data">
2.下拉列表
优点:(1) 节省页面空间,使得页面更加简洁
(2) 方便输入
(3) 规范输入
<selectname="province">
<optionvalue="33">浙江</option>
<optionvalue="41">河南</option>
<optionvalue="32">江苏</option>
<optionvalue="36">江西</option>
</select>
<select>标签定义一个下拉列表
<option>标签定义下拉列表的一个选项
<select>标签的name属性定义了提交的参数名
<option>标签的内容定义了该选项显示的文本,value属性定义了选中该选项时传递的参数值。
<select>标签的size属性定义了下拉列表框的选项个数,当小于实际选项个数时,会自动增加一个滚动条。
3.下拉列表的分组
<optgroup>的label属性定义分组显示的文字,disabled设置该分组不能用。
<select>
<optgroup label="国产车">
<option value="红旗">红旗</option>
<option value="BYD">比亚迪</option>
<option value="奇瑞">奇瑞</option>
</optgroup>
<optgroup label="德系车">
<option value="奔驰">奔驰</option>
<option value="bmw">宝马</option>
<option value="大众">大众</option>
</optgroup>
<optgroup label="日系车">
<option value="本田">本田</option>
<option value="丰田">丰田</option>
<option value="三菱">三菱</option>
</optgroup>
</select>
4.textarea:
<textarea>)(文本域)标签定义一个多行的文本输入区域,文本区域中可供用户输入大量的内容。
cols(列数):规定文本域的列数
rows(行数):规定文本域的行数
readonly:规定文本区域为只读
maxlength:规定文本域的最大字符数
autofocus:规定当前页面时,会自动获得焦点
<textarea rows="10"cols="30">
</textarea>
5.Fieldset(自定义字段):
Form:规定fieldset所属的一个或多个表单。
Name:规定fieldset的名称。
Disabled:规定该组中的相关表单元素被禁用
Legend:对表单中的内容加以说明,类似于标题。
<form action="result.html"method="get">
<fieldset>
<legend>个人基本信息</legend>
姓名:<input type="text"><br>
性别:<input type="radio">男
<input type="radiol">女
<br>
年龄:<input type="text">
</fieldset>
<fieldset>
<legend>教育背景</legend>
毕业学校:<input type="text">
所学专业: <inputtype="text">
</fieldset>
<fieldset>l
<legend>职务信息</legend>
工作单位:<input type="text">
职务:<input type="text">
</fieldset>
</form>
6.隐藏域
当需要想服务器传递参数,且该参数无需用于输入,甚至都不想让用户看见,可以使用隐藏域来实现。
<form action="result.html"method="get">
<input type="hidden"name="stuNo"value="201712312"readonly><br>
原密码:<input type="password"name="old">
<br>
新密码:<input type="password"name="new">
<br>
<input type="submit"value="修改密码">
</form>
7.表格
表格的组成部分:标题、表头、主题、表尾
<table>定义一个表格
<caption>定义表格的标题
<thead>定义表头部分
<tbody>定义表格主题(数据)部分
<tfoot>定义表尾,一般显示汇总信息等。
<tr>定义一行
<th><td>定义一个数据项(单元格),<th>一般用于表头,有加粗样式,<td>一般用于表格主体部分,没有加粗样式。
<td>的rowspan和colspan分别定义单元格跨行的行数、跨列的列数。
- CSS选择框、下拉列表、文本域、表格
- JS+CSS和图片美化下拉列表选择框(select)
- JS+CSS和图片美化下拉列表选择框
- 下拉列表、隐藏域、表格
- HTML&CSS基础学习笔记1.23-表单的文本域和下拉列表
- HTML&CSS基础学习笔记1.23-表单的文本域和下拉列表
- 怎么禁止下拉列表框选择?
- 选择屏幕上的下拉列表框
- 带搜索框选择的下拉列表
- 下拉列表multiple选择
- 快速选择下拉列表
- 用户在对话框下拉列表中选择的为显示文本区中的文本
- div+css之CSS 文本设置 CSS 字体设置 CSS 列表设置 CSS 表格设置 css outline轮廓
- CSS表格和列表
- CSS表格与列表
- 纯css 下拉列表
- 2010.4.9CSS表单美化文本框,按钮,下拉框,文本域css代码
- 表格中用js左右添加从下拉列表中选择的内容
- caffe for Windows图像分类训练、测试实例
- 文本选择
- 九误九建:企业做好SEO网络营销推广的必经之路
- 设计模式 http://www.runoob.com/design-pattern/flyweight-pattern.html
- Spark安装
- CSS选择框、下拉列表、文本域、表格
- Android动态权限问题
- halcon学习之图像相减算子sub_image
- 建立树状包结构
- 如何在C++中使用VBScript(使用Qt)--How to use VBScript in C++ (Using Qt)
- HDU1166 敌兵布阵
- 素数环
- 一文弄懂神经网络中的反向传播法——BackPropagation
- python学习笔记(2)