深圳幻海软件技术有限公司

大部分同学都知道，在CSS世界中，有vw、vh、vmax、vmin这几个与视口Viewport相关的单位。正常而言：1vw等于1/100的视口宽度（ViewportWidth）1vh等于1/100的视口高度（ViewportHeight）vmin—vmin的值是当前vw和vh中较小的值vmax—vw

一般来说，我们使用 height:100vh 进行全屏布局，这是一种很方便的响应式方法。复制.content{height:100vh;}1.2.3.但当在实际设备上测试我们的设计时，我们遇到了几个问题：大部分移动端的Chrome和Firefox浏览器在顶部都有一个UI（地址栏等

如果有一个文本和一个按钮，我们想让文本粘在上面，而按钮粘在下面！使用CSSFlex似乎很容易做到。复制//HTML<divclassName="layout"><p>Loremipsumdolorsitamet...</p><button>SignUp

首先瞅一下效果图接着就是思考怎么做，我的想法如下图。 把公共的页头、页脚、导航栏、边框放到最顶层，比方说设置层级为999，其他每个独立页则放在下面，然后切换页面的时候更新独立页的层级以达到效果图的效果(当然不能超过最顶层)。适配上面的方式已经把效果做出来了，接下来就是响应式适配了。1、Ma