☆HTML 基础☆

★HTML文本标签hn,span,p

HTML中标题(heading)分为6级，分别是：h1、h2、h3、h4、h5、h6

普通文本标签与段落标签

★普通文本标签span

在HTML用于显示文本的基本标签对是span。

虽然不编写任何标签，将文字直接写于body标签对内也能正常显示，但是这样我们对此文本的控制力会极度的减弱。

段落标签p

如果我们想如同现实中写文章一样，将文章达到分段效果，那么我们就可以使用段落标签p.

行内标签&块级标签

我们发现多个span标签可以同处一行，而p标签只能每个独占一行。

其本质原因是因为他们是不同类型的标签元素，

p是块级标签，span是行内标签

块级元素具有的特征就是独占一行，行内元素具有的特征就是允许多个行内元素同存一行、

★注意：

你所看到的每个p标签上下都有一个空行，那不是块级标签的特征，那只是段落p标签独具的特征。

文章标签&文章中的节标签 article,section

文章标签article

此标签用定义独立的文章或者文档

“W3C组织"对它的描述是：

article标签定义外部的内容，外部内容可以是来自一个外部的新闻提供者的一篇新的文章，或者来自博客的文本，或者是来
自论坛的文本。亦或是来自其他外部源内容，该标签的内容独立于文档的其余部分。

注：html标准就是w3c组织制定的

该标签从目前浏览器版本来看仍还不属于功能性标签，即不具有明显的特殊效果。仅仅对标签中的字体有细微的效果影响。

现在国外很多新闻信息类网站是根据其英文译意“文章、条目"之接将其作为每一篇文章的“容器"来使用。

文章中的节标签section

section 标签定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。

和article一样，该标签从目前浏览器版本来看仍还不属于功能性标签，即不具有明显的特殊效果。仅仅对标签中的字体有细
微的效果影响。

与article不同的是，该标签具有一个属性“cite"该属性的值为一个“url"，用于指出该段话摘自于哪一个网站，不过现在版本的
浏览器并不支持该属性，但现在至少也可作为版权纠纷时的一个说明凭证。

布局标签div

可以这样说，div标签是目前为止，HTML中最具代表性的标签，内业很多开发者在谈到“HTML+CSS"都会说成“DIV+CSS"。

那DIV到底是什么东西呢？他具有什么强大的作用吗？

很遗憾，div标签是一个“块级标签"，而且只是一个“块级标签"

我们现在可以将“div…/div"写进我们的编辑器看看它到底是什么。

HTML图片显示 img

要在HTML显示图片是通过img引入外部图片实现的，

★src属性

“src"是图片的必要属性，

通过将该属性的值设置为 【硬盘或服务器地址上图片的绝对路径】 或 【HTML页面和图片间的相对路径】即可显示指定图片。

★alt属性

由于网络的不稳定、部分用户的带宽较小或图片体积较大等原因，有的时候网页上的图片不能马上显示出来（路径错误会导
致图片不能显示），

这个时候一个比较稳妥的做法，就是给予一定的文字说明，这个时候就需要用到img标签内的“alt"属性，只需将“alt"的属性值设为需要提示的文本信息即可。title属性

在对于需要进行说明的图片，或者单纯是为了提升用户体验，我有的时候需要为图片进行一定的简单描述，在特定的条件

下，在图片旁边写上一串文本，既影响了布局，又显得突兀，这个时候我们就需要用到img标签内的“title"属性。

在这里需要说明的是，“title"这个属性，是一个全局属性，最常用的地方虽然是img标签，但它在其它几乎任何标签上都可以使用，包括文本标签span。
img标签的类型

★关于行内标签和块级标签

我们讲已经知道了“行内标签"和“块标签"，明白了多个“行内标签"在限定的屏幕宽度内是不会换行的，而“块标签"则不然，每个“块标签"之间都会自动进行换行。

实际上，除此之外，他们间还有一个比较显著的区别，就是“行内标签"是不能进行大小（宽高）设置的，它的大小是由它里面的内容多少决定的。而“块标签"的大小是可以设置的我们可以通过css来设置一个p和一个span标签的宽高来查看效果。

★关于img标签的类型
而img标签却既不是行内标签，也不是块级标签。或者说他既是行内标签也是块级标签（即他同时具有这两种标签类型的特征）

Img标签具有行内标签类型的特征：允许多个img标签或者多个行内标签同处一行。
Img标签也具有块级标签类型的特征：可以设置宽高等css属性。

HTML超链接标签 a
具有使当前页面跳转到一个新的页面的功能的标签-------超链接标签（a标签）
超链接标签的主要属性为 href 与 target
①　Href作用
决定此标签被点击后将跳转到那个文件，必须给出此属性。
如果没有这个属性，a标签会类似于一个span一样的文本标签，且不会给文字设置颜色和下划线。
②　Href值的类型
href的值，也就是要跳转的文件类型，可以是如下类型
【一个http/https协议的网站】
【一个站内网页】
【一个电子邮件地址】
【一张图片】
【一个文本文件】
【一个应用程序】

虽然类型很多，但是对他而言就只有两种情况：
当前浏览器能识别的类型【比如网站地址，图片地址，txt文档地址】就正常显示
当前浏览器不能识别的类型【比如: zip,doc,excel,ppt…】 就直接下载
target属性决定以何种方式行进跳转或打开新的文件（是在当前窗口还是新窗口打开？）
arget可以为以下值：
_blank ： 在一个新的浏览器窗口或标签页中打开页面或文件
_self ： 在当前浏览器窗口打开页面或文件
a标签实现锚点链接
即通过a标签跳转到网页中指定的位置
如果将标签的href属性值设置为#+当前页面中指定元素的ID值后，该超链接将不再是进行页面间的跳转或是文件的打开了，而是实现在当前页面的跳转【如果一些百科网页】
a标签实现文件下载
标签除了能跳转到页面、文件，跳转页面位置，在HTML5中还能够定义一个文件的下载，并设置下载文件的名字。
要具有这个功能，我们需给它加上“download"属性，并指定一个文件下载后的名称。
a标签回到页面顶部
我们在一个内容很多的网页中加上a标签，并且他的href属性赋值为#top，那么当我们点击这个超链接时可以让当前网页回到最顶部。
若网页中使用了这种方式让页面回到顶部的话，当前页面的所有元素都要避免使用“top"这个id值，否则该功能会失效。（此时会变成一个描点链接）
★a标签的几种状态
一个超链接从我们访问开始，会有几种状态，如下：

未点击： 颜色为蓝色，表示未访问此链接 点击中： 颜色为红色，表示即将访问此链接 点击后： 颜色为紫色，表示已访问此链接
对于已访问后的链接，就会变为紫色，然后会把当前情况存储在浏览器中，即便你从新运行此网页颜色仍然是紫色，甚至很多浏览关掉后在打开还是显示的已访问状态。
注意：如果我们使用css设置了一个颜色，那么他会强行覆盖上面的三种状态颜色。 HTML框架标签 iframe iframe
元素会创建包含另外一个网页文档的内联框架（即行内框架），所有浏览器都支持 iframe标签。 a标签与iframe标签的混合使用
通过将a标签的target属性设为页面中一个嵌入式框架iframe的“name"属性的值，使文件内容在这个iframe内打开。
通过iframe标签引入一个html文件，文件中含有一个a标签，链接百度地址。如果此a标签的target属性值为"
_parent 表示在框架的父级打开页面或文件
__top 在框架的最顶层打开新的页面或文件（若包含多个框架的嵌套）*

当href的值为特殊值时，不同的表达方式

.当 href为正常值时显示正常
.没有href，如同一个span标签，表示普通文本

.#号(描点链接相关)

.空格(会刷新)

.void(会执行js代码，返回空，什么都不做)

.alert(666),(会执行js代码，弹框)