Question

我刚开始使用带有UI路由器的Angularjs而且我一直在创建我希望全屏的登录页面，

index.cshtml

<body>
    <div ng-app="myApp">
        <div ui-view></div>
    </div>
</body>

login.html

<div class="login">Login</div>

mystyle.css

body, html {
    height:100%;
}

.login {
    background-image:url(../img/bg.jpg);
    //Could change to background-color here but it doesn't matter
}

但这是结果：

编辑：在Chrome开发工具中查看

Answer 1

也许您应该使用Chrome检查器检查您的网页，并验证包含您的应用的div和具有.login类的div是否为整页高度。

在这种情况下，你应该在你的top div和ui-view div中添加一个类，并为它创建一个CSS。

.myFullscreenDiv { width: 100%; height: 100%}
.login { width: 100%; height: 100%}

并在您的HTML中

<body>
    <div ng-app="myApp" class="myFullscreenDiv">
        <div ui-view class="myFullscreenDiv" ></div>
    </div>
</body>

使用ui路由器的全屏幕背景图象

1 个答案: