1.iframe标签
嵌套页面 <iframe src="http://www.baidu.com" name="xxx"></iframe>
frameborder="0" 是消除边框。
倘若我想要在内嵌的空白区域打开我指定的a标签连接,就需要给ifame里加一个name:xxx
然后在a标签里加target:xxx 。 image.png
src也可以指向一个相对路径:src="index.html"。
iframe标签详情
2.a标签
<a> 标签跳转页面(发起HTTP GET 请求)
<a> 元素最重要的属性是 href 属性,它指示链接的目标。
示例 打开本网站中的页面的一个连接:
点击本文本: image.png 示例 打开一个网站页面的连接: image.png
点击QQ: image.png 示例 在一个新页面打开网站连接: image.png
点击之后会在新页面打开,这里就不演示了。
示例 加一个下载连接: image.png上面讲到在新页面打开网站连接:<a href="http://www.qq.com" target="_blank">在新页面打开连接</a>
还有在自己页面打开连接 <a href="http://www.qq.com" target="_self">在自己页面打开连接</a>
在父页面打开连接 <a href="http://www.qq.com" target="_parent">在父页面打开连接</a>
在顶页面打开连接<a href="http://www.qq.com" target="_top">在顶页面打开连接</a>
这四个属性需要结合iframe理解,比如a是顶页面,内嵌了一个b页面,又在b页面里内嵌了一个c页面。那么对于c页面来说,b页面就是parent,c就是self,a就是top。
那么在href里到底能写什么呢:
无协议绝对地址://qq.com 这个当前协议是什么,跳转的就是什么协议下的qq.com
相对路径: xxx.html
查找参数: ?name=xxx
什么都不写:刷新页面 #:返回顶端
关于a标签,还有一个伪协议,点击a标签后什么都不会发生:
<a href="javascript:;" name="xxx">xxx</a>
a标签详情
3.form标签
form标签 跳转页面(发起HTTP POST请求)
form标签里面必须有input标签
如果不加mothod="post" 默认的就是get请求(但是get请求就是用a标签了)。
form标签也有target,这个和a标签是一样的。
form标签详情
4.input/button标签
image.png
图片显示两个按钮一样,但是button就是个普通按钮,submit按钮是可以提交的。
input标签的元素:button、submit、checkbox、radio等。
这个勾选按钮只能在按钮里进行,若是想要点文字也能进行勾选,可以用label将它们关联起来:
image.png
关于label也可以用于其他:
image.png
点击文字用户名就可以在框里输入。这就是关联label的用法。
多选的用法: image.png
radio(单选):
image.png如果不给两个input同一个name,后面的radio勾选能两个同时选上,加上name,只能选一个。
其他的元素参考表单类型
5.table标签
表示表格数据 — 即通过二维数据表表示的信息。table里面的元素:thead表头,tbody主体,tfoot脚。 tr:table row行,td:table data数据,th:table header表标题(注意和thead区分)。