![Array[林]](/views/front/img/head.png){kind=avatar}
HTML知识点总结——个人笔记（仅供参考`v`）
HTML知识点总结【干货合集，速度上车！！！】
HTML的英文全称是 Hyper Text Markup Language，即超文本标记语言。
HTML的作用？
HTML是一种制作万维网页面的标准语言，是万维网浏览器使用的一种语言，它消除了不同计算机之间信息交流的障碍。
HTML网页代码的基本格式及解析：
网页的标题
细心的朋友可以发现，以上的HTML网页代码基本格式中都是由多对标签构成的，HTML标签是HTML语言中最基本的单位。
HTML标签的大小写无关的，例如
HTML标签多种多样，具体的标签内容及作用，可参考手册：
HTML标签参考手册
当然并不是所有标签都是成对出现的，也存在特殊的自结束标签，例如：
标签的属性：
**标签中可以设置相应的属性（是一个名值对：x=y）
**属性用来设置标签中的内容如何显示
**属性和标签名或其他属性应该用空格来隔开
**一个标签可设置多个属性
重点标签详解：
表格标签：用于在网页中绘制表格数据
table:用来定义表格
tr：用来定义表格的行
td：用来将每行切割成若干单元格（定义表格列）---td标签中填写数据单元格的内容
th：定义表格的表头--浏览器默认把表头显示为单元格内粗体居中的文本
img图像标签:将指定图片显示到网页中，为自结束标签
img标签有src和alt两个属性：
src：存放的是图像的URL地址
alt：用来为图像定义一串预备的可替换的文本，当浏览器无法载入图片时，替换文本属性会告诉读者此图片的信息
一般浏览器支持的格式包括：
JPG/JPEG：
-支持的颜色比较丰富，不支持透明效果，不支持动图
-一般用来显示照片
GIF：
-支持的颜色较少，支持简单透明，支持动图
-颜色单一的图片，动图
PNG：
-支持的颜色丰富，支持复杂透明，不支持动图
-颜色丰富，复杂透明的图片
webp：
-这种格式是谷歌新推出的专门用来表示网页中的图片的一种格式
-它具备其他图片格式懂得其他优势，而且文件还特别小
HTML注释标签：新手学习最好在敲代码的同时对自己的代码进行注释，使阅读更方便
**在HTML网页中编写代码应注意：
在网页中编写的多个空格默认情况会自动被浏览器解析为一个空格。
在HTML中有些时候，我们不能直接书写一个特殊符号，比如多个连续的空格，字母两侧的大于小于号。
如果我们需要在网页中书写这些特殊符号，则需要使用HTML中的实体（转义字符）
实体语法：
&实体的名字；
空格
>大于号
<小于号
©版权符号
HTML5
———作为HTML的进化版，虽然仍处于完善之中，但现在大部分现代浏览器已经具备了某些HTML5支持
HTML5新特性
一、用于绘画的 canvas 元素
二、用于媒介回放的 video 和 audio 元素
三、对本地离线存储的更好的支持
四、新的特殊内容元素，比如 article、footer、header、nav、section
五、新的表单控件，比如 calendar、date、time、email、url、search
一、用于绘画的 canvas 元素
canvas元素用户图形的绘制，但是此标签只是图形容器，我们必须要用脚本来绘制图形，在此容器中我们可以绘制路径、盒、圆、字符以及添加图像
canvas用法：
创建一个canvas：
在页面生成一个矩形：
使用JavaScript来绘制图像：
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(0, 0, 200, 100);在页面生成一个背景色为红色的矩形：
二、用于媒介回放的 video 和 audio 元素
video元素提供了播放、暂停和音量控制来控制视频；同时还提供了宽高属性来控制视频在页面展示的尺寸。
video元素中通过source标签来链接视频文件，video中可放置多个source标签来链接不同的视频文件。而浏览器将使用第一个可识别的格式。
当前video元素支持三种视频格式：MP4、WebM和Ogg。
MP4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件。
WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件。
Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件。
audio元素用法与video基本相同。
audio元素支持三种音频格式文件: MP3, Wav, 和 Ogg。
三、对本地存储的更好的支持
HTML5可以在本地存储用户大的浏览数据。
客户存储数据的两个对象为：localStorage和sessionStorage。
localStorage - 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除。
sessionStorage - 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。
四、新的特殊内容元素，比如 article、footer、header、nav、section等
article：定义页面独立的内容区域。
footer：定义 section 或 document 的页脚。
header： 定义了文档的头部区域
nav：定义导航链接的部分，作用和div类似，主要用于页面布局
section：定义文档中的节（section、区段）。
五、新的表单控件，比如 calendar、date、time、email、url、search等
具体功能实现及用户可自行查看文档
参考文档：HTML教程|菜鸟教程
建议学习天数:5天
HTML学习视频推荐：【尚硅谷】Web前端零基础入门HTML5+CSS3基础教程丨初学者从入门到精通