HTML常用标签介绍
HTML标签：通常被称为HTML标签，HTML标签是HTML语言中最基本的单位，HTML标签是HTML最重要的组成部分。
- 标签不分大小写，但是常用小写
- 标签分为闭合标签和空标签：
<html></html>、<p></p><image/>,<input/>
html标签分类
分为块状元素 和内联元素(行内元素)
块状元素
块级元素就是本身属性为display:block;的元素。可以进行大的布局搭建。
比如<div>,<p>,<h1>-<h6>,<table>,<from>......
特点：
- 独占一行，从上到下来排布
- 有宽度、高度以及盒子模型的相关css属性
- 在不设置
宽度,高度的情况下，块级元素的宽度继承它父级元素内容的宽度与高度
内联元素(行内元素)
内联元素是指本身属性为display:inline;的元素。可以进行文字、小图标（小结构）的搭建。
有<a>,<strong>,<i>,<span>,<b>,<em>,<img>,<input>......
特点：
- 和其他内联元素从左到右在一行显示
- 没有宽度、高度以及盒子模型的相关css属性，但是直接设置内外边距的左右值
- 内联元素的宽高是由本身内容的大小决定（文字、图片等）
- 内联元素只能容纳文本或者其他内联元素（此处请注意:
不要在内联元素中嵌套块级元素）
如何去嵌套
- 块级元素可以包含内联元素或某些块元素，但是内联元素不能包含块元素，它只能包含其他的内联元素。
- 有几个特殊的块级元素只能包含内联元素，不能再包含块级元素。如:h1~h6、p、dt。
- 块级元素不能放在p标签里面。
- li 标签可以包含 div 标签，因为li 和 div 标签都是装载内容的容器。
iframe与a标签
什么是iframe
<iframe>表示嵌套的浏览上下文，有效地将另一个HTML页面嵌入到当前页面中。
<a>标签的打开方式有如下四种
<a href="[http://qq.com](http://qq.com/)" target="_blank">blank QQ</a>在新窗口打开
<a href="[http://qq.com](http://qq.com/)" target="_self">self QQ</a>在本身打开
<a href="[http://qq.com](http://qq.com/)" target="_parent">parent QQ</a>在父级窗口打开
<a href="[http://qq.com](http://qq.com/)" target="_top">top QQ</a>在顶级窗口打开
正常情况下 iframe 单独使用没什么特别之处，但是iframe和a配套一起使用的话就有几个特别的技巧。
其中_parent,_top的区别就是 当在iframe中打开两个或以上时候，前一个返回的是父级窗口，而后一个返回的就是顶层窗口(就是它的祖宗)。
举个例子：
假如说有三个index.html页面
index1.html 当中包含 index2.html
<body>
index.html
<iframe src="./index2.html" frameborder="0"></iftame>
</body>
index2.html 当中包含 index3.html
<body>
index2.html
<iframe src="./index3.html" frameborder="0"></iftame>
</body>
index3.html 在这里面有<a>标签的四种打开方式
<body>
index3.html
<a href="http://qq.com" target="_blank">blank QQ</a>在新窗口打开
<a href="http://qq.com" target="_self">self QQ</a>在本身打开
<a href="http://qq.com" target="_parent">parent QQ</a>在父级窗口打开
<a href="http://qq.com" target="_top">top QQ</a>在顶级窗口打开
</body>
第一种：在新窗口打开
第二种：在index3.html的大小范围中打开
第三种：在index2.html中打开
第四种：回到了index1.html中打开
<a>标签有download属性
一般加上download属性是强制浏览器下载的形式在页面上展示。还有别的方法也可以以下载的形式展示，例如：
修改Content-type为：Content-type：application/octet-stream也可以。
如果Content-type是别的，比如是text/html，就不能以下载的形式展开，但是可以增加download属性来强制下载，但是可能部分浏览器的某些版本不支持。
<a>标签的 href=' '
<a href="http://qq.com"></a>
修改成
<a href="qq.com"></a>
那么这里不能跳转到qq主页，因为这是一个相对地址，使用的是file协议，浏览器会把它当作是一个以后缀名为com的文件打开它。
但是：
如果是通过http://协议，那么它跳转的就是QQ的主页。为什么？ 这是因为使用的协议是http:
下面还有几种用法
# xxx 代表锚点
- 查看地址栏的状态 它会在网址URL后面加上#
-
它的作用只是页面内的跳转(会在页面中滚动，返回到顶部)，其他的都是需要发起请求的。
image.png
?name=bomber 代表GET请求
image.png
./xxx.html 会跳转新页面
image.png
a标签的javascript伪协议
<a href="JavaScript:alert(1);">请求</a>
会弹出alert。
作用:
就是点击a标签之后不要跳转的作用，同时也没有请求。
但是需要加一个分号;，分号代表JS的代码，表示伪协议什么都不做。
总结一下a标签的几种用法
- //qq.com 会根据当前协议而使用什么协议
- #xxx ?name=bomber ./xxx.html #是锚点 其余都是请求
- 伪协议 <a href="JavaScript:;"> 什么都不做的奇葩需求
