响应式布局之相对浏览器垂直居中

此文仅仅作为知识点的积累，涉及到的小知识如下：

• viewport ：浏览器的可视窗口
• vw ：Viewport宽度，1vw 等于viewport宽度的1%
• vh : Viewport高度，1vh 等于viewport高的的1%

页面中元素的响应式布局是前端开发工作者经常运用到的，bootstrap的栅格系统虽然很适合响应式布局，但仅仅是用于页面宽度变化时的响应，此文承接上一篇，仅在CSS文档中做配置。

实例要求：

• 父组件在浏览器中全屏显示
• 子组件为320* 200的图片
• 子组件始终相对于父组件即浏览器垂直居中。

HTML部分：

<div class="fu">
   <img src="./myIcon.png" class="zi" />
</div>

CSS部分：

.f