响应式布局

响应式布局是指一个网站能够兼容多个终端,

通过媒体查询，具体如下：

@media(max-width : 800px){ }

当device的宽度小于或等于800像素时，使用{}内的CSS规则进行页面渲染

（1）图片响应式布局

  img{

     max-width:100%;

    display:block;

     height:auto;

}

(2) 排版响应式布局

p{

    width:75vw;

}

其中：

vm： 75vm 表示75%的视窗宽度

vh ：50vh  表示50% 的视窗高度

vmin：70vmin 表示视窗的更小维度的79%

vmax：90vmax 表示视窗更大维度的90%