写在前面：
我是一个前端小菜鸟，这个是根据b站视频整理的笔记，可能不够全面，也可能会有些小错误，欢迎指正（鞠躬🙇）：
【前端面试题-Vue】vue生命周期_哔哩哔哩_bilibili
html复习：
1️⃣行内元素有哪些？块级元素有哪些？空（void）元素有哪些？
行内元素：span a strong b I em button Img input label select textarea
块元素：div h1-h6 ol ul li footer header section article nav p table form
空元素（void） br hr
元素之间转换：
display:inline=》不独占一行，不能设置宽高
inline-block=》不独占一行，能设置宽高
block=》独占一行，能设置宽高
2️⃣页面导入样式时，使用link和@import有什么区别？
- 加载顺序区别：浏览器先加载link，后加载@import
- link先有，后有@import（兼容性link比@import兼容）
3️⃣title与h1的区别、b与strong的区别、i与em的区别？
(1)title与h1的区别：
title概括了网站信息，可以告诉搜索引擎或者用户关于这个网站的内容主题是什么
H1:文章主题内容
具体区别：
title显示在网页标题上，h1显示在网页内容上；
Title比h1更重要（对于seo的了解）
场景：网站的logo都是用h1标签包裹的
(2)b与strong的区别：
b:实体标签，用来给文字加粗
strong:逻辑标签，用来加强字符语气的
区别：b标签只有加粗的样式，没有实际的含义。
strong表示标签内字符比较重要，用以强调的
（为了符合css3规范，b尽量少用，改用strong）
(3)I与em的区别：
定义：
i:实体标签，用来做文字倾斜
em:逻辑标签，用来强调文字内容
区别：i标签只是一个倾斜标签，没有实际的含义。
em表示标签内字符比较重要，用以强调的
场景：
i更多的用在字体图标上，em用在术语上（医药，生物）
4️⃣img标签的title和alt有什么区别？
区别1:
title:鼠标移入到图片显示的值
alt:图片无法加载是显示的值
区别2:
在seo的层面上，蜘蛛抓取不到图片的内容，所以前端在写img标签的时候为了增加seo效果，要加入alt属性来描述这张图是什么内容或者关键词
5️⃣png、jpg、gif这些图片格式解释一下，分别什么时候用？
png：无损压缩，尺寸体积要比jpg/jpeg的大。适合做小图标
jpg：采用压缩算法，有一点失真，比png体积要小。适合做中大图片
gif：一般是做动图
webp:同时支持有损或者无损压缩，相同质量的图片，webp具有更小的体积。兼容性不是特别好
