user1354934
user1354934

Reputation: 8841

how to override body background color in angular app?

the app has a predefined background that is persistent throughout all pages and is defined in the main css file.

i want to override that background in one of my pages. how can I do that? I have given the body in index an id called "body-m".

The html structure is -

<body ng-app="app" id="body-m">
  <div class="container-m">
    <section ng-view id="content-m"></section>
  </div>
</body>

My page is being loaded in the ng-view. How can I change the background for only my page?

Thanks

Upvotes: 2

Views: 3700

Answers (2)

Devashree Hingne
Devashree Hingne

Reputation: 31

If you want to change color throughout the project then you can add this CSS in style.scss.

body{
    background-color: #ddd;
}

Upvotes: 1

unpollito
unpollito

Reputation: 1019

Use CSS's ID selector:

#body-m {
    background-color: #FAFAFA;
}

If you only want to change the page being displayed through ng-router, you should have some kind of ID inside that page. For instance, if there was a div inside that particular view, assign it a special ID or class:

<div class="dark-background">
    <!-- your stuff goes here! -->
</div>

Then use the .dark-background selector in CSS.

Upvotes: 3

Related Questions