Css 如何创建垂直的“垂直”；“第页”；其中每个页面都是使用引导和角度的视口高度？

我使用的是Angular 1.3和Bootstrap 3.2。我想创建一个单独的网页，这样做：。i、 e.我希望能够有垂直堆叠的div，它们是视口的高度。我正在考虑制定一个指令，监视浏览器的高度/宽度，并相应地更新样式

---

还有其他想法吗？有没有关于执行指令的提示

这是

vh

和

vw

的完美用例

简单设置：

.wrapper {
    width: 100vw;
    height: 100vh;
}

---

它会解决这个问题。如果你必须支持任何一种，你可以很容易地做一个快速的JS后退。

CSS会帮你一部分，但是你需要JS在调整大小时更新你的100%高度 和滚动顶点等，你还需要一种方法来动画的滚动无论如何。这不完全是我要做的，但它解释了基本的想法

$($window).on('resize', function() {
   $scope.winWidth = $(window).width();
   $scope.winHeight = $(window).height();
});

...

$scope.getSectionStyle = function(){
  return {width:$scope.winWidth, height:$scope.winHeight} ;
}

...

<section id="sectionId" ng-style="getSectionStyle()"

要将

\u转换为

，只需找到元素偏移量（）

var offset = $('#sectionId').offset();
$rootScope.scrollTo(offset.top);

---

很好，谢谢。你的JS回退会检查浏览器类型/版本吗？我个人会使用Modernizer检查兼容性。如果你觉得这是过度杀戮，一个非常肮脏的黑客将添加！对于您的VH/VW来说很重要，这样，如果浏览器无法检测到VH/VW，它将被忽略，JavaScripts H/W将成为先例。但是，我不建议您将Modernizer用于特征检测作为最佳实践！如果你需要进一步的帮助，请告诉我！谢谢你的回答。实际上，当您调整大小时，100vh的CSS更改似乎也能起作用，但只支持最新的浏览器。感谢您提供有关设置锚定滚动动画的提示。

var offset = $('#sectionId').offset();
$rootScope.scrollTo(offset.top);