三件套

html

什么是 HTML?

HTML（HyperText Markup Language，超文本标记语言）是一种用来告知浏览器如何组织页面的标记语言。HTML 可复杂、可简单，一切取决于 web 开发者。HTML 由一系列的元素组成，这些元素可以用来包围或标记不同部分的内容，使其以某种方式呈现或者工作。两端的标签可以使内容变成超链接，以连接到另一个页面；使字体表现为斜体等。

html标签

head标签

使用开发者工具

什么是浏览器开发者工具？ - 学习 Web 开发 | MDN (mozilla.org)

css

[‌‌⁤‌⁣⁡⁡⁤⁡‍⁤⁣‌⁡‌⁢⁤‍⁤‬‍⁤‌‌⁡‬⁤⁢⁢⁢⁤‬⁡⁣⁡‬‬字节前端训练营 - 深入理解 CSS.pdf - 飞书云文档 (feishu.cn)] CSS（层叠样式表）用于设置和布置网页——例如，更改内容的字体、颜色、大小和间距，将其拆分为多个列，或添加动画和其他装饰功能

层叠优先级（优先级递减）

(bytedance.feishu.cn/file/BsO2bt…)

样式表来源

选择器优先级

源码位置

盒模型

javascript

JavaScript 是一种脚本，一门编程语言，它可以在网页上实现复杂的功能，网页展现给你的不再是简单的静态信息，而是实时的内容更新，交互式的地图，2D/3D 动画，滚动播放的视频等等。JavaScript 怎能缺席。它是标准 Web 技术蛋糕的第三层。

js特性：箭头函数

// ES5 
var total = values.reduce(function (a, b) { return a + b; } , 0); 
// ES6 
var total = values.reduce( (a, b) => a + b, 0);
// ES5
$("#confetti-btn").click(function (event){ 
playTrumpet();
fireConfettiCannon(); }
);

$("#confetti-btn").click(event => {
playTrumpet();
fireConfettiCannon(); }
);

DOM

DOM是文档对象模型：当网页被加载时，浏览器会创建页面的文档对象模型。

文档：一个网页可以称为文档
节点：网页中的所有内容都是节点（标签、属性、文本、注释等）
元素：网页中的标签
属性：标签的属性

前端语法篇 | 青训营笔记

三件套