响应式导航栏固定底部的HTML边距底部

Question

我在mi页面的末尾有navbar-fixed-bottom。

<nav class="navbar navbar-default navbar-fixed-bottom" role="navigation">
  <div class="container">
    <img src="images/banner2.jpg" class="img-responsive">
  </div>
</div>

我为HTML添加了保证金底部

html { margin-bottom: 100px }

..以避免页脚覆盖我的内容。这适用于桌面分辨率，但分辨率较小，而不是。那是因为页脚的img是响应性的，所以高度降低了，但不是HTML的margin-bottom。

问题是如何使html的margin-bottom“响应”，具体取决于导航栏的高度。

感谢。

Answer 1

我用

制作了它

@media (max-width: 640px) {/
  html { margin-bottom: 50px }
}