web容器如何自适应视口大小

前言 在前端生涯上，经常会遇到需要容器自适应视口高度这种情况，本文将介绍我能想到的解决这个问题的方案。 基础知识 html元素的高度默认是auto（被内容自动撑开），宽度默认是100%（等于浏览器可视区域宽度），没有margin和padding； body元素的高度默认是auto，宽度默认是100%，有margin而没有padding； 若想让一个块元素（如div）的高度与屏幕高度自适应，始终充满屏幕，需要从html层开始层层添加height=100%，而又因为html,body元素的width默认就是100%,因此在里面的div 设定width=100%时就能和屏幕等宽。 方法一：继承父元素