1.form-表单标签:
form标签一般会与"input".“select”."textarea"等标签连用。
属性:
action-跳转路径
method-用以明确表单提交的方式(get/pust)默认值是get
name-表单的名称
(get请求会把用户信息暴露在地址栏上)
pust相较于get比较安全
路径:
1.绝对路径:从盘符开始,找到你所需要的文件的路径:路径+文件的名称
C:\Users\clown\Desktop\演示\demo01.html
2.相对路径:当前源文件和目标文件的相对位置
./demo01.html
input标签:
语法:(name一般可不写)
type取值:
取值 | 含义 |
---|---|
text | 文本框 |
password | 密码框 |
radio | 单选按钮 |
checkbox | 多选按钮 |
submit | 提交按钮 |
reset | 复位按钮 |
button | 普通按钮 |
image | 图像按钮 |
file | 文本域(上传文件的按钮) |
hidden | 隐藏域 |
emali | 邮箱按钮 |
color | 颜色按钮 |
date | 日期 |
time | 时间 |
datetime-local | 日期加时间 |
range | 进度条 |
input属性:
属性 | 含义 |
---|---|
checked | 默认选择 |
readonly | 只读(字段只可以读不能修改) |
disabled | 禁用(不可点击) |
autofocus | 默认光标位置 |
required | 不能为空白提交 |
演示:
text–文本框
password–密码框
加上value后:
radio–单选按钮
这里就需要同时输入name属性以确保单选功能的实现。
也可以加入"checked"属性,就行默认选定。
checkbox–多选按钮(也可以加入"checked"默认选项)
email–邮箱按钮(由于"disabled"属性的使用,此时邮箱内的内容是不可点击修改的)
file–文本域按钮(上传文件)
此时系统只支持选择一个文件,若需选择多个文件可以加上"multiple"属性。
2.select-下拉列表框标签:
一般与"option"标签进行连用。
(这个"value"属性我们现在用不到,可以删掉不管)
使用"selected"默认选择属性
使用"multiple"多选项属性,可以列表形式出现。
(这里的"name"和"id"属性一样用不到,可删去不管。)
3.textarea-文本域标签:
cols=“30”–多少列–表示文本域的宽度。
rows=“10”–多少行–表示文本域的长度。
注意:以上介绍的各类标签如:“input”,“select”,"textarea"须在"form"表单标签里进行使用,以达到预期功能。(将上面的各功能组合使用就获得了一个最基础的登录注册页面)
(align是位置属性,bgcolor是背景颜色属性,background背景图片属性:一般情况下,浏览器优先级不同,会对背景颜色和背景图片进行取舍)
(“color”,“datetime-local”,“submit"和"reset"属性分别是颜色选择,日期,提交和复位,还有其他的一些功能作者没有着重介绍,读者可以自己尝试)
到此一个基础的注册登录页面就完成了,点击提交的话,系统就会按照你所提供的路径进行相应跳转。
(跳转路径输入action=”./demo01.html"有两种方式)
(1)找到你要跳转的文件"右键"+“复制相对路径”
(2)输入"./"系统会自动提示让你选择