实现自适应和响应时布局作为一名在校大学生，目前虽然还没有尝试面试，但是却总是会看到一些大佬写的面经，所以我总结了一些最经

作为一名在校大学生，目前虽然还没有尝试面试，但是却总是会看到一些大佬写的面经，所以我总结了一些最经典常见的考点。

 每天学一点知识，慢慢累积，然后自己冲冲冲。

自适应设计是能使网页自适应显示在不同大小终端设备上新网页设计方式及技术。 自适应布局通过检测视口分辨率，来判断当前访问的设备是：pc端、平板、手机，从而请求服务层，返回不同的页面，它需要开发多套界面来适应不同的终端。

响应式设计就是一个网站能够兼容多个终端一而不是为每个终端做一个特定的版本。响应式布局通过检测视口分辨率，针对不同客户端在客户端做代码处理，来展现不同的布局和内容。它需要开发一套页面,然后全部适配。

在HTML的头部加入meta标签。

viewport：视口，表示网页的可视区域；
width：可以对viewport的大小进行控制，可以指定一个具体固定的值，例如 900，也可以是由关键字组成的特殊值，例如 device-width 就表示该设备的宽度；
initial-scale：表示初始缩放比例，也就是页面第一次加载时的缩放比例；

<meta name="viewport" content="width=device-width, initial-scale=1" />

meta完整的介绍

<meta name="viewport" content="width=device-width,
user-scalable=no,initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0">

响应式页面在头部会加上这一段代码：
<meta name="applicable-device" content="pc,mobile">
<meta http-equiv="Cache-Control" content="no-transform ">