如何制作响应式风格-知识点回顾
1：如何进行页面布局？
弹性盒子： display:flex
可以实现 垂直，水平居中、垂直反序 flex-direction:column-reverse，水平反序 flex-direction:row;
两端留白：justify-content:space-around，子元素占据剩余空间：justify-content: space-between；
改变视觉列表项顺序：order:-1(所有最前面);
进行排列项： flex-flow: row wrap;
flex:1;
这个是简写，其实这里有三个值，flex:0 1 auto；
第一项：是相对于其它伸缩项，当前伸缩项在空间允许的情况下可以伸展的量。
第二项：在空间不够的情况边，当前伸缩项相对于其它伸缩项可以收缩的量。
第三项：是伸缩项伸缩的基准值。
2：h5的新增两个点:
(1)pattern新增正则表达式。
（2）required必填项。
【如何制作响应式风格-知识点回顾】3：svg 是什么？
解：伸缩矢量图，可以进行代替png,jpg ，好处在于：不用在于屏幕的分辨率，它都不会失真，而且
大小比它们都小。
4：视口是什么？
解：视口指屏幕显示在屏幕的区域，视口并不等于屏幕的宽度，这个不同概念。
视口按照屏幕的宽度进行展示网页。
5：断点是什么？
解：即不同屏幕显示不同布局的分界点，这个让设计师来确定。
6：响应式图片，这个在使用同一种图片的时候：
解：width :100%这个会进行伸缩。
max-width:100%这个不会进行拉伸。
7：响应式图片有可能使用不同的断点的时候，使用不同的图片，给出多种选择。
（1）picture元素，不一定会支持结合source（多种图片选项） 和 img（不支持的时候，默认的图片选项） 进行使用。
（2）srcset 和sizes 结合使用进行切换分辨率，来提供不同图片地址路径。
8： 100vw指的是什么，1.5x 指的是什么？
解：（1）100vw 视口宽度的100%。
（2）1.5x指的分辨率1.5倍 适用于1.5 分辨率的屏幕，其实也是只分辨率比1x高。
推荐阅读
- 考研英语阅读终极解决方案——阅读理解如何巧拿高分
- 如何寻找情感问答App的分析切入点
- mybatisplus如何在xml的连表查询中使用queryWrapper
- MybatisPlus使用queryWrapper如何实现复杂查询
- （七）谈条件
- 如何在Mac中的文件选择框中打开系统隐藏文件夹
- 漫画初学者如何学习漫画背景的透视画法（这篇教程请收藏好了！）
- java中如何实现重建二叉树
- Linux下面如何查看tomcat已经使用多少线程
- thinkphp|thinkphp 3.2 如何调用第三方类库