前端有什么
提到前端，首先想到的就是被称作前端三剑客的HTML、CSS和JavaScript，它们是前端最基础也最重要的部分，它们各司其职，构成既美观性能又好(bushi)的前端页面。
- HTML用各种标签构成前端的骨架，我们在浏览器中打开的文件就是.html后缀。只要标签里填充了内容，就能称作一个简单的页面(虽然很丑陋)。
- CSS则负责页面的美化，规定各个元素的长宽颜色等等，可以理解成好看的皮肤。
- JS就是网页的灵魂了，负责处理各种逻辑，毕竟网页总不能是静态的，肯定要有交互。
我们知道了这三名门语言，它们是如何在浏览器中执行的呢？
浏览器中有两个引擎，渲染引擎和JS引擎。前者负责加载页面，根据html和dom树的结构获取css资源，计算页面的排版，并将页面绘制出来；JS引擎将代码转换为可执行的指令并在浏览器中执行。
HTML
HTML是一种标签语言，几乎都是成对出现的，在前标签的内部添加属性，在一对对标签的中间添加内容。我们来看一段初始的HTML代码
<!DOCTYPE html>
<html lang="en">
<head> // 头标签，在里面添加一些适用于整个文件的属性
<meta charset="UTF-8"> // 使用的字符格式
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title> // 页面标题
</head>
<body>
// 主体标签，在里面添加页面的主要内容
</body>
</html>
HTML的标签分为以下几个类别：
- 文档型，比如
<!DOCTYPE>、<head>、<body> - 闭合型，比如闭合标签
<p></p>和空标签<br><img><input>等 - 换行型，比如块级标签
<div><h1>和行内标签<span><a>等 - H5新元素，比如语义化标签、媒体标签、表单标签、功能标签等
贴一张课程里的图吧
CSS
CSS是前端中语法最简单的一部分，但是想写好却不容易，本质就是在各种选择器之间添加键值对，来规定某个元素的展示效果，可以写在html标签内部(内联式)也可以写在head标签中的style标签中(嵌入式)，还可以把代码写在一个单独的css文件中(外联式)再引入html文件
内联
<p style="color:red">红色。</p>
嵌入
<head>
<style type="text/css">
span{ // 标签选择器
color:red;
}
</style>
</head>
外联
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
JavaScript
JS是一个究极缝合脚本语言，语法非常灵活，功能也很全，可以写在script标签中也可以单独写在文件里再再html里引入。东西太多啦不细写了，有需要看之前的博客吧。
老师讲的css/js in html和html/css in js 暂时听不懂，等后面深入学习再来了解原理层面相关的东西8
