第三天了、(表单、表单的元素、表单的属性)
表单:
标签名:
1、form (表单) action(路径 ) method (提交方式)
2、method (提交方式)
( get提交 ) 在路径后面加参数 ; 显示的是 ?name=123&age=123
注意: 键中不要加空格,加空格后所显示的就不是想要的数值了 ?name=123&age=123 ?name =123&age=123
值不要加引号,同样的加引号后得到的数值就不同了 ?name=123&age=123 ?name=“ 123 ”&age=123
( post提交 )这种提交方式比较安全,不会在路径中显示想要的数值, 在请求信息里面加参数
表单元素:
文本框属性
这三点对文本框,密码框,多行文本都有用,
{ 一、placeholder=“ 文本框 ” 就是文本框里显示的数值,比如现在输入的是文本框,显示的就是文本框,输入其他的时候就消失了。
二、disabler 不能操作其中的东西,但是有光标
三、 readonly 只读,不能输入,没有光标。}
1、文本框类型
(1)文本框:text
(2)密码框:password
(3)隐藏域:hidden
(4)多行文本 :texarea
2、按钮类型 disabled 不可操作,对按钮建都有用,只看则没用
(1)提交: submit、 button标签也是提交的意思
(2)复位: rest
(3)普通:button
3、选择类型 disabled 不可操作有用,只看则没用。
label 标签 将文字刻选择标签相关联
用法1:将选择标签包起来。
用法2:label标签的for属性的属性值是选择标签的id值。
然后将选择标签代表的意思放到label标签的内容位置。
(1)单选:radio
checked 默认选中
(2)多选:checkbox
checked 默认选中
(3)下拉:select option 兄弟标签
muliple 多选属性 默认展开全部选项 是select的属性
size 默认展开显示几个选项 是select的属性
selected 默认选中 是option的属性
4、文件类型 (1)file form必须加属性 enctype=“ multipart/form-data”
5、图片类型 (1)image
6、表单元素的通用写法
< input type=“类型” name=“ ” value=“ ”>
name:在表单中和value是键值对
在单选多选中有分组的意思
7、表单的特殊元素
(下拉)
< select name=“ ” id=“ ”>
< option value=“ 中的数值和后面的选项1相对 ” >选项1< /opion>
< option >选项2< /option >
< option value=“ ” >选项3< /opion >
< /select >
value : option里面有value属性那就是属性值
option没有value属性 那就是属性值
8、多行文本
< textarea name=“ ” id= “ ” cols= “宽 ” rows= “ 高 ” >
内容就是value 值
< /textarea >
<!-- form 表单标题-->
<form action="guowy.html" method="post" ><br />
<!--文本框账号 不可操作--> <!--不可操作--> <!--文本框默认值-->
账号:<input type="text" name="" value="" disabled placeholder="你奶奶" /><br />
<!--密码框 只读--> <!--只读-->
密码:<input type="password" name="" value="" readonly /><br />
<!--隐藏域-->
<input type="hidden" readonly="readonly"/><br />
<!--选择类型 单选-->
<label>
<input type="radio" checked="checked" name="9" />男
</label>
<input id="oo" type="radio" name="9" />
<label for="oo">女</label><br />
<!--选择类型 多选-->
爱好:<input type="checkbox" />吃饭
<input type="checkbox" />睡觉
<input type="checkbox" />打豆豆<br />
在哪睡觉:<input type="checkbox" />床
<input type="checkbox" />沙发
<input type="checkbox" />地板<br />
<!--下拉 selected默认显示这一选项-->
在哪打游戏:<select name="" id="" multiple size="2">
<option value="">家</option>
<option value="" selected >网吧 </option>
<option value="">别人家</option>
</select><br />
<!--多行文本-->
个人简介:<textarea name="" id=""></textarea><br />
<!--文件类型-->
<input type="file" /><br />
<!--图片类型-->
<input type="image" src="img/2.png" />
<!--普通按钮 只是一个按钮的样子 并没有提交的效果-->
<input type="button" value="提交" />
<!--复位按钮-->
<input type="reset" readonly="readonly" />
<!--提交按钮-->
<button>登录</button>
</form>