HTML知识点

最近在总结之前学过的一些小知识点，和大家分享一下。

一.html中的标签元素

在html中的标签元素大体被分为三种不同的类型：块级元素、内联元素(又叫行内元素)和内联块级元素。

块级元素特点：

1、每个块级元素都从新的一行开始，并且其后的元素也另起一行。（霸道，一个块级元素独占一行）
2、元素的高度(width)、宽度(height)、行高(line-height)以及顶(top)和底边距(bottom)都可设置。
3、元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致）
常用的块状元素有：

<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、              <address>、<blockquote> 、<form>

设置display:block；可以将元素转换块级元素。

内联元素(行内元素)特点：

1、和其他元素都在一行上；
2、元素的高度、宽度及顶部和底部边距不可设置；
3、元素的宽度就是它包含的文字或图片的宽度，不可改变。
常用的内联元素有：

<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>

设置display:inline;可以将块状元素转换为内联元素

内联块级元素特点：（同时具备内联元素、块级元素的特点）

1、和其他元素都在一行上；
2、元素的高度、宽度、行高以及顶和底边距都可设置！
常用的内联块状元素有：

<img>、<input>
display:inline-block；float:left/right；
position：absolute/fixed;

可以将元素设置为内联块级元素。

二.src，href区别

src

表示文件引入，是页面必不可少的一部分，是引入。
src(source) 表示来源地址，在 img、script、iframe 等元素上，src指向的内容会嵌入到文档中当前标签所在的位置

href

表示文件引用，是与该页面有关联。
href 表示超文本引用（hypertext reference），在 link和a 等元素上使用，用来建立当前元素和文档之间的链接。

简单的说，src用于替换当前元素；href用于在当前文档和引用资源之间建立联系。

三.alt和title区别

title

title它既是html的标签也是它的属性，我们通常写的html标题就是title标签

<title>网页标题</title>

title作为属性时，可以为元素提供额外说明信息。
例如，给超链接标签a添加了title属性，把鼠标移动到该链接上面是，就会显示title的内容，以达到补充说明或者提示的效果。

alt

alt只是html标签的属性，alt属性只能用在img、area和input元素中，用于网页中图片无法正常显示时给用户提供文字说明使其了解图像信息。alt是替代图像作用而不是提供额外说明文字的。

使用alt属性还具有搜索引擎优化效果，因为搜素引擎是无法直接读取图像的信息的，alt可以为其提供文字信息所以对搜索引擎比较友好。

通常人们容易搞错的是title和alt这两个属性同时用于img标签的时候。在旧版本的IE浏览器中，鼠标经过图像时显示的提示文字是alt的内容，而忽略了title属性，这个曾经误导了很多人。因此，如果想在IE中显示title的内容，要么title属性和alt一致，要么alt内容为空（“”，空格也不能有）。不过，在新版的IE（IE8及以上）中，已不会出现这种情况了。

另外，当a标签内嵌套img标签时，起作用的是img的title属性。

四.Doctype，标准模式和严格模式

声明叫做文件类型定义（DTD），声明的作用为了告诉浏览器该文件的类型。让浏览器解析器知道应该用哪个规范来解析文档。声明必须在 HTML 文档的第一行，这并不是一个 HTML 标签。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。

严格模式（标准模式）

严格模式是浏览器按照 W3C 标准解析代码，呈现页面，是一种要求严格的DTD，正确声明DTD。
触发严格模式很简单，就是正常的建立网页，声明正确的DTD，便是严格模式。

混杂模式（怪异模式或兼容模式）

混杂模式则是指浏览器用自己的方式解析代码
混杂模式的触发可以通过在HTML文档开始不声明DTD（文档类型声明）

区别：
浏览器解析时到底使用严格模式还是混杂模式，与网页中的 DTD 直接相关。

1、如果文档包含严格的 DOCTYPE ，那么它一般以严格模式呈现。（严格 DTD ——严格模式）
2、包含过渡 DTD 和 URI 的 DOCTYPE ，也以严格模式呈现，但有过渡 DTD 而没有 URI （统一资源标识符，就是声明最后的地址）会导致页面以混杂模式呈现。（有 URI 的过渡 DTD ——严格模式；没有 URI 的过渡 DTD ——混杂模式）
3、DOCTYPE 不存在或形式不正确会导致文档以混杂模式呈现。（DTD不存在或者格式不正确——混杂模式）
4、HTML5 没有 DTD ，因此也就没有严格模式与混杂模式的区别，HTML5 有相对宽松的语法，实现时，已经尽可能大的实现了向后兼容。（ HTML5 没有严格和混杂之分）