如何使页面布局响应 window 大小的每个连续微小变化？
How to make page layout responsive for every successive little change in window size?
是的，我知道如何使用媒体查询。但它允许我们指定 min-width 和 max-width ，即 css 将改变的范围。但是考虑这个网站 styledotme.com
随着我们减小 window 大小，导航栏正下方的 block/div 越来越小，几乎就像一个像素一个像素一样。这种响应能力是如何实现的？
媒体查询和元素的组合，在不同尺寸下看起来都不错。一种技术是使用大小可覆盖的背景图像。这个不使用媒体查询：
#menu { height: 50px; background-color: green; }
#footer {height: 50px; background-color: blue; }
#middle {height: calc(100vh - 100px);
background-image: url(http://placehold.it/200x100);
background-size: cover;
background-position: center;
}
<div id="menu">Menu</div>
<div id="middle">Middle</div>
<div id="footer">Footer</div>
是的，我知道如何使用媒体查询。但它允许我们指定 min-width 和 max-width ，即 css 将改变的范围。但是考虑这个网站 styledotme.com
随着我们减小 window 大小，导航栏正下方的 block/div 越来越小，几乎就像一个像素一个像素一样。这种响应能力是如何实现的？
媒体查询和元素的组合，在不同尺寸下看起来都不错。一种技术是使用大小可覆盖的背景图像。这个不使用媒体查询：
#menu { height: 50px; background-color: green; }
#footer {height: 50px; background-color: blue; }
#middle {height: calc(100vh - 100px);
background-image: url(http://placehold.it/200x100);
background-size: cover;
background-position: center;
}
<div id="menu">Menu</div>
<div id="middle">Middle</div>
<div id="footer">Footer</div>