Setting a background image on Razor Pages Identity 'manage account' page

Question

I am trying to set a background-image on my Login and Manage account pages for ASP.NET Core Web application - I'm using Razor Pages identity, but it won't seem to change no matter where I put the CSS.

I tried putting it on the login page itself and also on the site CSS, but still nothing.

It has worked on my other pages but not on these.

my css is as follows:

body{
    background-image: url('hero-range-1.jpg');
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

Answer 1

Since the Logout page is under Identity area,so the url of background image will be /Identity/hero-range-1.jpg,so you need to put the image into wwwroot/Identity,here is a demo:

image root:

/wwwroot/Identity/hero-range-1.jpg

Areas/Identity/Pages/Account/Login.cshtml:

...
<style>
    body{
        background-image: url('../hero-range-1.jpg');
        height: 100%;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
</style>