Question

我有一个内置于angularjs的网页。

<html>
<head></head>
<body ng-app="app1" ng-controller = "ctrl1">

<header></header>

<div ng-view></div>

<footer></footer>

</body>
</html>

此处页眉和页脚始终是固定的，但在内容部分，当我进行路由时，在其中一个视图中，我有标题，我总是想要修复。

问题是当对内容标题使用position:fixed时，在移动主页滚动时，标题下方的内容似乎向上移动。

所以我的问题是如何以这样的方式创建标题：在向下滚动内容部分或主要部分时，标题应始终固定。

任何帮助表示赞赏!!!

谢谢

Answer 1

您需要做的是向内容添加padding-top，其内容等于标题的高度。这样，您的内容永远不会在标题下方向上滚动

.content-header {
height: 30px;
position: absolute;
top: 0px;
}
.content-container {
padding-top: 30px;
overflow: scroll;
position: relative;
}

Answer 2

对该div使用overflow: scroll;。

<div class="content" ng-view></data>

.content {
    width: 150px;
    height: 150px;
    overflow: scroll;
}

Answer 3

您可以使用bootstrap来简化您的任务。请参考： https://getbootstrap.com/examples/navbar-fixed-top/

希望这会对你有所帮助。