一.iframe标签
该标签是在页面中通过一个小窗口再显示一个页面
1.frameborder="0" 去掉边框
2.name="xxx"跟a标签结合用,在a标签中的target属性填入xxx,则点击超链接后,再ifame框中来显示新页面
3.现代很少使用
二.a标签
即超链接
1.target属性
target="_blank" 在新网页打开
target="self" 在所在页面打开
target="parent" 结合iframe标签使用
target="top" 结合iframe标签使用
2.download属性
3.href属性
A.a标签的无协议绝对地址,自动继承协议:
href中填写qq.com,点击超链接不会跳转到QQ界面,因为不知道是什么协议,因此我们在命令行里输入npm i -g http-server然后再输入http-server,得到的IP地址输入到浏览器中加上/文件名,就可在浏览器中预览该文件,且href中填写//qq.com也可正常跳转到QQ网页,因为命令行中输入的就是让它按照当前协议的来。
B.a标签的相对路径:./xxx.html
#sss 锚点 页面内的跳转 所以不会发起请求即GET
?name=zhousil
C.javascript伪协议:javascript:; 用a标签,但是点击后不想让它跳转和任何反应:如果是#号的话页面会动,比如跳转到页面顶部,因此只能写成javascript:; 即伪协议
javascript:alert(1); 点击超链接后直接跳转js
三.form标签
与<a>标签的不同:<a>标签发起的是GET请求即获取内容,form标签发起的是POST请求即上传内容
1.<form>需要设置一个按钮(type="submit"),否则无法提交;
2.主要是用来发起POST请求的,响应暂时不管。 (file协议不支持POST),如下:
(如果method写成GET, 会默认将查询参数写在地址栏里,账号密码都会直接显示出来)
3.name会被带到第四部分编程key
4.target属性的使用与a标签一摸一样,也可以跟<iframe>的name联合使用
5.action 属性用来指定请求路径
6.input:(没有给name属性的<input>,都不会传给服务器)
A.<input>标签中可搭配<label>标签使用,则点击到文字上就可激活该项,如:
<input type="checkbox" id="aaa"><label for="aaa">爱我</label>
但老司机不按照此常规来写,即不用指定id和for来匹配,直接用<label>标签将<input>标签包起来,即:
<label>用户名<input type="text" name="username"></label>
B.<button>标签不写type,会默认升级为提交按钮,且该标签可以有子元素,<input>不能有
C.<input>中的type="button",则只是一个按钮,不能提交,submit才能提交
D.用户名和密码需要用上name属性,如下:
没有给name属性的<input>,都不会传给服务器
E.radio : 单选框,必须设定name属性,且设置的值要一致,不然单选框会都选中
F.select: 下拉列表,其中disabled表示满了不能选了,selected则是默认选择。如下:
G.<textarea> 是 一个可输入多行文字的文本框,如果要固定框的大小,需要用到css的resize:none
四,<table>标签
1.<tr> 即table row,代表每行
2.<th>即table header ,是表头,如姓名,班级,年龄等;<td>即table data,是填写表里的具体数据,如小明,2班,16岁
<tfoot>可省略,省略后则会依照写的顺序显示
3.table默认有个边框且很宽,如果不想要,如果用css的border-collapse:collapse;