课程重点

• 前端语言的基本能力
• 前端语言的协作配合
• 你不知道的HTML
• 拓展分享

课程内容

前端语言的基本能力（HTML、JS、CSS）

HTML：主要作用是构建框架结构
包含控制内容布局，为web设计师提供一个层次结构，它是所有web页面的一个起始。
CSS：层列样式表
用来给网站添加样式，具体包含给元素添加样式，适配不同的屏幕、尺寸以让网页具备响应式的特征，是网站外表和体验的最重要的一个工具。
JavaScript：
增加交互体验，（网页交互是web的精髓），还可以处理复杂的函数，可以保证更高的效率以及可用性。
下图很详细的描绘的他们各自的作用： 三个语言都是同等重要的，缺一不可。
他们是如何在浏览器中运转的？（这个要了解的，上次面试问了！！）
首先浏览器包含两种引擎：渲染引擎 & JavaScript引擎。
渲染引擎：
主要负责加载页面，根据HTML来设置DOM树的结构，接着获取CSS资源并构建CSSOM树，结合DOM的结构特性和CSSOM的样式特性，渲染引擎会计算最终页面的排版，并推断哪些部分可以作为一个整体合并为一个图层，这样渲染的效率会更高。最后把页面绘制出来。 JavaScript引擎：（以V8举例说明）

前端语言的协作配合

CSS在HTML中的应用：（基本的有三种）
Inline CSS - 直接在HTML标签中通过Style来添加样式 Internal CSS - 内部CSS
在HTML头部通过Style标签添加样式 External CSS - 引入外部的样式 JavaScript在HTML中的应用：
它有一个很重要的概念：DOM
它把页面上HTML部分转换成对应的JavaScript对象，eg： DOM的试验机制：试验捕捉&试验捕获 HTML在JavaScript中的应用：
CSS在JavaScript中的应用 CSS Moudule和JSS都是现在用得比较普遍的技术，他们本质上其实都要解决一个CSS全局类名容易冲突的问题，eg：

你不知道的HTML(5)

HTML是前端开发中最基本也是最简单的一门语言。
HTML并非图灵完备，它只是一门标记语言。 其中最核心的是标签。

HTML全部标签分类：

文档型是必须具备的标签！！！

head标签

ARIA - 可访问的互联网富文本应用

了解ARIA并非只是为了提供盲人阅读，它可以为我们设计UI系统提供指导意义。
简单来说其实就是通过给标签添加一下额外的属性，使整个页面理解起来更容易。

HTML5

其实是包含一些特性的HTML规范 音频能力：
Audio video HTML5对二进制也有不错的支持能力：
可以通过FileReader来读取文件，它读取的文件一般是一个Blob对象。File其实也是继承自Blob的。 HTML5还提供一些其他的API（简单放几个例子） WebAssembly WebAssembly（WASM）是一种新的编码方式，可以直接在浏览器中运行