【form两个重要属性】
action:表单需要提交的服务器地址
method:表单提交数据使用的方法,get/post
>>>get和post的区别
① get传参使用URL传递,所有参数在地址栏可见,不安全;get传参数据量有限。
② post传参使用http请求传递,比较安全;post可以传递大量数据。
但是,get请求的传输速率比post快。
>>>URL传参的形式:链接URL地址?name1=value1&name2=value2
【input的常用属性】
① type:设置input的输入类型
② name:给input输入框命名。一般情况下,name属性必不可少。因为,传递数据时,使用name=value(输入内容)的形式传递。
③ value:input输入框的默认值
④ placeholder:输入框的提示内容。当input有默认的value或输入值时,placeholder消失
【input-type属性的常用属性值】
① text:文本输入框
② password:密码输入框,输入内容默认显示小黑点
③ radio:单选框 checkbox:复选框
>>>使用radio/checkbox时,value属性必填。提交时,提交的为value中的默认值;
>>>radio/checkbox凭借name属性,确定是否属于同一组,name相同为同组,只能选一个
>>>使用checked='checked'属性,设置默认选中项
④ file:文件上传
>>>使用accept='类型',设置只能上传的文件类型,如 accept=image/* 表示任意格式图片
⑤ submit:提交按钮,将所有表单数据提交至后台服务器
⑥ reset: 重置表单数据
⑦ image:图形提交按钮,跟submit一样,具有表单提交功能
>>>使用src属性确定图片路径
⑧ button:普通按钮,没有屌用
【属性名=属性值的情况】
① checked='checked' 设置radio
② multiple='multiple' 设置select控件为多选,可在界面使用Ctrl+鼠标,进行多选。一般不用。
③ selected='selected' 设置select控件,默认选中的option选项
④ readonly='readonly'
⑤ disabled='disabled'
当input被disabled时,该input的name和value数据将无法向后台传送
⑥ hidden='hidden' 隐藏控件。等效于
⑦ nowrap=nowrap
【下拉选择控件 select】
① 写法:
option可以有N多个
② name属性,应该写在上,所有选项只有一个name
③ multiple='multiple' 设置select控件为多选,可在界面使用Ctrl+鼠标,进行多选。一般 不用。
④ option常用属性:
value='':当option没有value属性时,往后台传递的是标签中的文字;
当option有value属性时,往后台传递的是value属性的值。
title='':鼠标指上后显示的文字。
selected='selected':默认选中。
⑤ :用于将option标签进行分组,label属性表示分组名。
【文本域 textarea】
① 写法:
② 设置宽高style='width: 200px; height: 150px;' 自身有cols='' rows=''两个属性,但不常用
③ readonly='readonly' 设置为只读模式,不允许编辑。
④ style='resize: none;' 设置为宽高不允许修改。
⑤ style='overflow: ;' 设置当文字超出区域时,如何处理。
>>> 也可以通过overflow-x/overflow-y分别设置水平垂直方向的显示方式。
>>> 常用属性值:hidden 超出区域的文字,隐藏无法显示
scroll 无论文字多少,均会显示滚动
auto 自动,根据文字多少自动决定是否显示滚动条(默认样式)
【表格的边框与标题】
表格的边框边框标题
...若干个表单元素
【HTML5智能表单】
① H5新增input的form属性,用于指定特定form表单的id,实现input无需放在form标签之中,即可通过表单提交。
...
② 新增很多个type新属性,详见表格
③ 新增input的属性:
autocomplete:自动完成功能
>>>记忆之前输入过的内容,在下次输入时,根据以前的内容提示,自动完成。
>>>绝大部分浏览器自动开启
>>>有两个属性值:on/off
>>>可以在
标签上设置autocomplete,控制整在表单的自动完成开关, 但可在个别input上单独设置,覆盖form的整体设置autofocus: 自动获得焦点
form:所属表单,通过form表单的id,指向特定表单
required:必填。required='required'