最后：
总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。
面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。
5、web服务器：提供web服务的计算机。
6、URL（统一资源定位符）：互联网上标准资源的地址，可以从互联网上得到资源的位置和访问方法。
组成：协议、服务器地址、资源路径。
7、网页文件的扩展名：html、htm。文件内容：HTMl代码和文本内容。
8、网页：浏览器中打开的一个页面。网站：一组域名相同的网页的集合。
9、B/S架构：不需要下载客户端，通过URL访问。有跨平台能力。无缝升级，客户端免维修。不能直接使用客户端硬件资源，用户体验单一。
10、C/S架构：需要安装特定的客户端程序。针对不同平台开发不同版本。升级应用需要重新安装。充分应用客户端硬件资源，构建大型3D效果应用。
11、互联网发展：web1.0 web2.0 移动互联网
12、web开发过程：项目提出、需求分析、设计（UI设计、系统设计）、开发（前端开发、后台开发）、系统测试、发布维护。
13、网站类型：(1)、按网站主体性质划分：政府网站、教育科研网站、企业网站、商业网站、个人网站
(2)、按网站功能划分：宣传展示型网站、营销型网站、电子商务、网上购物、门户网站
14、树形结构：有主页有分支有叶子。扁平结构：扁平结构可以理解为是一种特殊的树形结构， 只有主干和树叶，是当前流行的一种网站结构，对 搜索引擎特别友好。
15、页面分类：首页：也称主页，是一个网站的入口网页。
列表页：一般都是二级页面，是栏目的具体展示页。
内容页：一般就是具体内容的页面。
16、页面元素：文字、表单、视频、图片、音频、动画。
万维网:www，通常也称网页。
网页：浏览器中打开的一个页面。
网站：一组域名相同的网页的集合。
浏览器：显示网页内容，并让用于与这些文件交互的一种软件。
服务器：提供web服务的计算机。
URL：统一资源定位符，协议、域名、资源路径。
网站访问过程：
⑴ 通过输入网址（URL）指定要访问的网页。
⑵ 浏览器向服务器发送请求：请把XXX网页文件传送给我。
⑶ 服务器做出响应：把XXX网页文件传送给浏览器。
⑷ 浏览器解析网页文件，呈现出网页。
软件架构分类及各自特征：
B/S架构
无需安装特定客户端程序，通过URL访问
跨平台能力（Windows、Linux、Android、IOS…）
无缝升级，客户端免维护
不能直接使用客户端硬件资源，用户体验单一
C/S架构
需要安装特定客户端程序
针对不同平台开发不同版本
升级应用须重新安装
充分应用客户端硬件资源，构建大型3D效果应用
web系统开发过程，及相关知识体系。
项目提出--需求分析--设计（UI、系统）--开发（前端、后台）--系统测试--发布/维护
网站类型
主体性质（政府网站、教育科研网站、企业网站、商业网站、个人网站）
功能划分（宣传展示型网站、营销型网站、电子商务、网上购物、门户网站、企业门户、在线 交易平台、政府门户）
网站结构（树型结构、扁平结构（特殊））
网站页面
页面分类（主页、列表页、内容页）
页面元素（文字、图片、表单、视频、 音频、动画）
学习Web开发的意义
掌握HTML、CSS语言
能够构建内容丰富、界面美观的Web页面
掌握相关开发、调试工具的使用方法
为后续Java、PHP等 课程打下基础
#第二章 HTML语言基础
=============
网页与网页文件。
网页：浏览器中打开的一个页面
网页文件：文本文件，扩展名html、htm，内容为HTML代码和文本内容。
网页与网页文件的关系：浏览器中看到的网页实质为：网页文件
网页页面的组成：内容+结构。
HTML简介
语言特点
发展过程
应用领域
HTML基本语法：语法、语义、词汇。
HTML标记分类（单/双标记），HTML属性的概念。
HTML文档结构（文档声明、html、head、body、title、meta）。
开发工具简介
编辑器
浏览器
浏览器开发工具
帮助手册
#第三章 构建页面（一）
============
网页元素包含内容：图片、文字、列表、超链接
在网页中插入文字（文字、实体、注释）
标题
--
段落
换行
水平线
实体:
< > & "
注释:
在网页中插入列表及相关属性的设置。
有序列表
- ..
无序列表
- ..
#第四章 构建页面（二）
============
在网页中插入图片及常用相关属性（src、alt）。
在网页中设置热区。
·id属性和name属性表示名称，设置为相同值，与标签的usemap属性匹配。创建 图像与热区之间的关系
·alt属性：该区域的替代文本；
shape属性：该区域的形状；（rect、circle、poly）
coords属性：该区域在原始图片上的坐标值。
href属性：该区域的链接地址；
在网页中插入超链接及常用相关属性（href、target）
href:链接地址
target：目标窗口在何处打开
_blank：在新窗口打开
_self：在当前窗口打开
_parent：在父窗口打开
_top：在顶层窗口打开
锚的应用。
锚点：网页中的某一位置。
锚点链接：在同一个页面跳到指定位置的方式。
创建锚点链接：
①建立锚点
②创建指向该锚的链接
相对路径、绝对路径的概念。
在网页中使用内联框架（iframe）。
标签的常用属性是: src：文件的路径width： “内联框架”区域的宽度
height：“内联框架”区域的高度
scrolling：规定是否在 iframe 中显示滚动条：
No：不出现滚动条 Yes：显示滚动条 Auto：自动出现滚动条
frameBorder：设置是否显示框架的边框。(1，0)
name：框架的名字，用来进行识别。
<iframe src="URL" width="x" height="y" scrolling="[OPTION]" frameborder="x" name="main">
#第五章 构建页面（三）
============
在网页中插入表格及简单样式修饰。
词汇(标签)：
语法：1. 成对出现 2. 嵌套于
语义：定义一行
词汇(标签)：
语法：1. 成对出现 2. 嵌套于标签内
语义：定义表头
词汇(标签)：
语法：1. 成对出现 2. 位于内
语义：定义一个单元格
相关属性
width:规定表格元素的宽度（pixels或%）
bgcolor：表格背景颜色
background：表格背景图
align：表格的对齐方
border： 表格边框的宽度（pixels）
bordercolor：表格边框的颜色
cellpadding : 单元边沿与其内容之间的距离
cellspacing : 单元格之间的空白（pixels或%）
colspan:跨列
rowspan:跨行
在网页中插入表单及简单样式修饰。
标签：<form action="" method="">
action：规定当提交表单时向何处发送表单数据 值：URL
method：规定用于发送 form-data 的 HTTP 方法。 值：get/post
标签：<input type=".." name=".." value="..">
text
password
radio
checkbox
file
submit
button
reset
<textarea rows="3" cols="2">...
<select name="..">
.. .. ..#第六章 HTML4.01与HTML5
===================
HTML5与HTML4.01。
定义嵌入对象 html4 html5
定义外部交互内容或插件 html5
定义声音内容 html5
定义视频 html5
HTML多媒体概述。
video与audio
object与embed
多媒体元素基本属性和常用方法。
Canvas基础知识。
使用canvas绘制简单图形。
HTML样式修饰性标签介绍
font规定文本的字体、字体尺寸、字体颜色。
< font color=“red” size=“5” face=“黑体”>< /font >
strong用于强调文本
你好
b规定粗体文本
你好
#第七章 CSS语言基础
============
为什么使用CSS。
1、针对元素样式设置的属性太少
2、修改元素样式太麻烦
3、控制元素样式的代码冗余度过高
更专业的样 式修饰方法
更简约的布 局方法
更简便的样 式修饰方法
改一处动全局的方法
CSS简介。
CSS是 Cascading Style Sheet 的缩写。译作 「层叠样式表」。 是用于(增强)控制网页样式 并允许将样式与网页 内容分离的一种标记性语言。
CSS的基本语法：CSS代码是由一条条语句构成，而每一条语句的结构，都基本相同
样式写法：选择器 {属性：属性值；属性：属性值；..... }
选择器
1、标签选择器——选择器是HTML标签。影响整个页面中该种标签的样式。
2、类选择器——以“.”开头定义的选择符。影响所有以class属性引用该类的标签样式。
注意：类名的第一个字符不能使用数字
元素可以加入多个类。把各个类名放在class属性中，各个类名之间用一 个空格分 隔。类名的顺序并不重要。
3、id选择器——以“#”开头定义的选择符。影响以id属性引用该选择符的标签样式。
单一页面中，一个id选择器只能使用一次！
样式表
1、行内样式——在元素标签内通过style属性添加样式
用途：指定网页中个别元素的显示效果。不符合 样式与内容分离原则不推荐用
2、页内样式——在head部分的style标签内添加样式
用途：对页面中某些标签或元素设置样式风格。控 制当前页面样式，维护较困难
3、外部样式——引用外部建立的.css文件
用途：可同时控制多个页面，适用于各类大型网站， 可用性最强，推荐使用。
样式优先级：
1、ID选择器 > 类选择器> 标签选择器
2、行内样式>页内样式>外部样式
3、就近原则，距离元素最近的样式优先级最高
注释方法： /*…*/ 多行注释
多个样式，在同一内容上共同实现， 叫做：CSS样式的叠加
文档中的某些元素，将沿用为其父元素所设置的 样式，这种特点叫做：CSS样式的可继承性
结构和样式分离思想。
CSS基本应用示例。
#第八章 文本样式和字体样式
==============
CSS字体相关类样式修饰。
字体系列：font-family：‘宋体’，‘仿宋’；
字体大小：font-size：20px;(2em;)
字体风格：font-style:italic(normal\italic\oblique);
字体加粗：font-weight:900;(100~900;)(lighter\normal\bold\bolder)
字体综合设置：font:italic bold 36px '宋体';
CSS文本类样式修饰。
文本缩进：text-indent:2em;(20px;)
水平对齐：text-align:left(right\center)
文本修饰：text-decoration:none;(underline\line-through\blink)
文本颜色：color:red;(#000000;)
行高：line-height:2em;(20px;)
#第九章 超链接和伪类
===========
CSS超链接的修饰。
未被访问的超链接a:link
鼠标经过超链接a:hover
链接被点击的那一刻a:acitve
访问过的超链接a:visited
特定顺序设置： :link ，:visited，:hover, :active
超链接应用
CSS伪类的使用方法。
CSS伪元素的使用方法。
#第十章 背景样式和列表样式
==============
CSS背景类样式修饰
背景色：background-color
关键字（gray）
十六进制表示方式（#808080）
rgb表示方式，如：rgb（128,128,128）
背景图像：background-image
background-image:url(images/f1.png)
背景重复：background-repeat:repeat-x;
repeat;默认
repeat-x;
repeat-y;
no-repeat;
inherit;继承父元素
背景定位：background-position:50%50%;
center
top
bottom
right
left
背景综合属性：background
background:red url(images/11.png) no-repeat center;
CSS列表类样式修饰
列表类型：list-style-type
none 无
circle 空心圆
square 实心方块
decimal 数字
lower-alpha 小写英文
列表项图像：list-style-image
url（images/f1.png）
列表标志位置：list-style-position
outside
inside
列表综合设置
list-style:square inside url(images/f1.png)
#第十一章 网页布局
==========
布局简介: 网页布局是指网页内容 在页面上所处位置的设计。
布局概念
页面尺寸：
分辨率:800x600时，页面尺寸:780x428个像素
分辨率:640x480时，页面尺寸:620x311个像素
分辨率:1024x768时，页面尺寸:1005x600个像素
布局常见版式
布局的方法
布局思想：由整体到局部
结构性标签div、span
Div
• div相当于一个容器（盒子）
• div标签可以把文档分割为独立的、不同的部分
• 通过id或class属性区分不同的容器
div具有盒子模型的所有属性， 布局时用来控制元素之间的距离和相对位置
应用浮动float
浮动：定义元素在哪个方向浮动，改变页面中对象的前后流动顺序
Left 左浮动
Right 右浮动
None 不浮动
Inherit 继承父元素float属性
float所产生的问题
- 浮动元素距离父元素边框的位置，是该侧的父元 素padding+自身margin的值
2. 通常不会超过父元素的边界
3. 元素一旦浮动就不属于父元素了
4. 浮动元素不会相互重叠
5. 不能上下浮动，通常只设一种浮动即可
6. 如果父元素宽度不够，浮动元素会另起一行显示。
Overflow
1、父元素不设高度并且子元素浮动时，使父元素高度自 动适应子元素高度。
2、父元素设置的高度或宽度小于子元素时，使父元素出 现相应滚动条或隐藏子元素超出部分内容
Clear
用来设置该元素边上没有其他元素可以浮动
clear: left / right / both / none
相对定位、绝对定位
✓ 绝对定位
✓ position:absolute
•1、与left，right，top，bottom等属性共同使用
•2、如果父元素未设置position属性，则以浏览器 窗口左上角为起始位置
•3、如果父元素设置了position属性，则以父元素 左上角为起始位置
✓ 相对定位
✓ position:relative
•1、与left，right，top，bottom等属性共同使用
•2、以自身本应在的位置为起始位置
float和position相似点：
1、都是将元素浮动起来
2、元素一旦设置就与父元素没关系了 float和position
不同点：
1、position与top、left等配套使用
2、float位置移动通过margin、padding等实现
3、overflow和clear对position无效
Vue 面试题
1.Vue 双向绑定原理
2.描述下 vue 从初始化页面–修改数据–刷新页面 UI 的过程？
3.你是如何理解 Vue 的响应式系统的?
4.虚拟 DOM 实现原理
5.既然 Vue 通过数据劫持可以精准探测数据变化,为什么还需要虚拟 DOM 进行 diff 检测差异?
6.Vue 中 key 值的作用？
7.Vue 的生命周期
8.Vue 组件间通信有哪些方式?
9.watch、methods 和 computed 的区别?
10.vue 中怎么重置 data?
11.组件中写 name 选项有什么作用？
12.vue-router 有哪些钩子函数?
13.route 和 router 的区别是什么？
14.说一下 Vue 和 React 的认识，做一个简单的对比
15.Vue 的 nextTick 的原理是什么？
16.Vuex 有哪几种属性?
17.vue 首屏加载优化
18.Vue 3.0 有没有过了解？
19.vue-cli 替我们做了哪些工作？
