立一个flag！

这是我参与【第五届青训营】伴学笔记创作活动的第1天，给自己立个flag：坚持记笔记，不做摆烂小菜鸡！

认识前端

• 什么是前端？前端工程师需要做的是用web技术栈解决多端人机交互问题，呈现出来的内容和网页就是前端。
• 什么是前端技术栈？HTML对页面结构、内容进行描绘，CSS对页面样式进行描绘，JavaScript定义网页的行为，三者都是运行在浏览器中的，可以通过网络协议和服务器端互通。这三者也构成了最基础的前端技术栈。
• 前端应该关注哪些方面？功能、美观、性能（如：动画的流畅度）、安全、无障碍（对不同人群、不同光线的环境等）、兼容（如：电脑、平板、手机均可使用）、体验。
• 前端的开发环境？浏览器（用来查看代码运行效果）+代码编辑器（如：vscode）即可。

HTML知识

打开vscode，新建html为后缀的文件即可编辑网页结构内容的相关代码。

在html文件中输入！+回车就可以看到一个比较完整、默认的网页代码框架，如下图： 我们从上面的代码中可以看出标签可以嵌套标签，如：html标签下有head和body两个标签，前者负责网页的信息、属性（如：网页标题），后者负责网页的内容。所以也可以将网页的框架结构类比做树，我们称其为DOM树。

HTML(HyperText Markup Language)称为超文本标记语言，它可以用不同的标签表达出不同的页面结构，比如图片、表格等等，并且即使是文本内容，也可以根据自己的需求，设定其为标题文本、段落文本、加粗文本、斜体文本等等。
标签丰富多样，同一种效果对应的表达形式本应有很多种，但是为了网页结构的清晰（方便搜索引擎爬取网页内容等等）、代码的可读性（方便网页维护等等），我们使用时要做到语义化，让对应的标签实现自己存在的意义（如：一级标题文本✅直接用h1标签，❌而不使用普通的p标签+style属性设置字体字号放大）。

除了上面提到的<h1>、<p>标签，还有很多种标签，在此简单介绍几个比较常见的：

标签	效果
<h1></h1>	一级标题
<p></p>	段落文本
<img />	图片
<a></a>	跳转链接
<ol><li></li></ol>	有序列表
<ul><li></li></ul>	无序列表
<table><tr><td></td></tr></table>	表格
<button></button>	按钮
<input />	输入框