Css 如何在AngularJS中保持页脚在页面底部和内容下方？

我曾尝试用各种方法将页脚放在某些内容下面，但似乎解决方案在AngularJS的动态内容中的表现与预期不符

当页面大部分为空白时，我希望页脚位于页面底部

当页面扩展时，或者一般来说页面太大时，我希望页脚被推到内容下方，而不是粘在页面本身上

当我重定向页面时，应该遵循相同的逻辑 这里有一个小的演示，我做来说明我的尝试。我尝试使用位置：绝对；对于我的页脚，但我不知道如何更改，或者在内容扩展后使用其他选项

var-app=angular.module'myApp'，['ui.router']； app.configfunction$stateProvider，$urlRouterProvider{ $stateProvider。 斯塔梅因{ 网址：/， templateUrl:main.html， 控制器：mainCtrl }. 州{ url:/other/small， templateUrl:other_small.html， 控制器：smallCtrl }. 州大{ url:/other/big， templateUrl:other_big.html， 控制器：bigCtrl } $urlRouterProvider。否则为“/”； }; 应用程序控制器'mainCtrl'，函数$scope{ $scope.small_text=aaa； $scope.big_text=new Array100.fillAAA； }; 应用程序控制器'smallCtrl'，函数$scope{ $scope.small_text=aaa； }; 应用程序控制器'bigCtrl'，函数$scope{ $scope.big_text=new Array100.fillAAA； }; 身体{ 身高：100%； 保证金：0； } 页脚{ 背景颜色：999999； 颜色：F1F1； 文本对齐：居中； } .页脚{ 位置：绝对位置； 底部：0； 高度：60px； 宽度：100%； } .主视图{ 背景色：F1F1； } 响应头 主页 小页 大页 演示网站2018&复印件； {{：：小文本} {{显示大文本？'Hide'：'show'}}大文本 {{text}} {{：：小文本} {{text}} 无需使用位置：绝对。只需在顶部留一个空白，并将页脚放在DOM的末尾。 然后，页脚将自动从正文内容结束的地方开始

var-app=angular.module'myApp'，['ui.router']； app.configfunction$stateProvider，$urlRouterProvider{ $stateProvider。 斯塔梅因{ 网址：/， templateUrl:main.html， 控制器：mainCtrl }. 州{ url:/other/small， templateUrl:other_small.html， 控制器：smallCtrl }. 州大{ url:/other/big， templateUrl:other_big.html， 控制器：bigCtrl } $urlRouterProvider。否则为“/”； }; 应用程序控制器'mainCtrl'，函数$scope{ $scope.small_text=aaa； $scope.big_text=new Array100.fillAAA； }; 应用程序控制器'smallCtrl'，函数$scope{ $scope.small_text=aaa； }; 应用程序控制器'bigCtrl'，函数$scope{ $scope.big_text=new Array100.fillAAA； }; 身体{ 身高：100%； 保证金：0； } 页脚{ 背景颜色：999999； 颜色：F1F1； 文本对齐：居中； } .页脚{ 边缘顶部：20px； 宽度：100%； } .主视图{ 背景色：F1F1； } 响应头 主页 小页 大页 演示网站2018&复印件； {{：：小文本} {{显示大文本？'Hide'：'show'}}大文本 {{text}} {{：：小文本} {{text}}

---

您可以尝试以下方法：

<div style="min-height: 100vh;position: relative;padding-bottom: 123px">
  ... // content
  <div style="position: absolute; bottom: 0; height: 123px">
  </div>
</div>

---

你错过了我的第一个要点。我的内容并不总是填满整个页面，因此我希望页脚在这些时候位于浏览器的底部。但是当页面变大时，是的，我希望它在内容结束的地方。当我用更多的内容扩展页面，或者只是有一个长页面时，这不起作用。向下滚动时，页脚保持在相同的位置。我希望它现在低于检查的内容，它工作正常