平常浏览网页的时候，可能有发现，同一个网页在手机上，和在pc端，所呈现的样式是不一样的，这种情况可以通过‘‘媒体查询’’来实现！
媒体查询：
格式：
@media 媒体类型 关键字 （媒体特征） {css样式}
媒体类型：此案例用到screen，即屏幕
关键字：此案例用到and，是表示‘和’的意思
媒体特征：个人理解，就是一个被赋予给媒体类型的特定条 件，如果媒体类型满足条件，就执行后方设定的css样式
案例思路：
在网页排版时，排两个样式的网页，一个是移动端网页布局，一个是PC端网页布局；随后在css中通过设置媒体查询，屏幕宽度小于某值时，PC端排版隐藏，大于某值时，移动端网页隐藏。
代码示范：
html：
<body>
<div class="wrapper">
<div class="max"></div>
<div class="min"></div>
</div>
</body>
scss：
@media screen and (min-width : 751px){
.min{
display: none;
}
}
@media screen and (max-width : 750px){
.max{
display: none;
}
}
min：移动端网页
max：PC端网页
scss设置：
1）屏幕宽度751px及以上的时候，移动端隐藏
2）屏幕宽度750px及以下的时候，PC端隐藏
至此，就通过媒体查询完成了移动版网页的屏幕缩放事件
