I want to set my whole web page of color blue. I tried using height=100% and width=100% like this I want to set my whole web page of color blue. I tried using height=100% and width=100% like this I want to set my whole web page of color blue. I tried using height=100% and width=100% like this

ngStyle to set background color of whole web page

136 Views Asked by At

<body [ngStyle]="{'background':'blue'}"></body> I want to set my whole web page of color blue.

I tried using height=100% and width=100% like this<body [ngStyle]="{'background':getColor(),'height':'100%','width':'100%'}"></body>, but still whole web page is blank.

1

There are 1 best solutions below

0
forbiddencoding On

[ngStyle] only works on the element it is specified in. To programmatically change the style of the applications <body></body> - since it is not part o any component - you can do the following:

In any component e.g. app.component.ts

import { Component, Inject } from '@angular/core';
import { DOCUMENT } from "@angular/common";

export class AppComponent {

    constructor(
        @Inject(DOCUMENT) document: Document
    ) {
        document.body.style.background = 'blue'
    }
}