Why does the app.component.css file not work in Angular?

0

When we run in the Angular command the ng g c page --spec=false it creates a component consisting of four files, an HTML file, a module file, a CSS file and a TS file as shown in the figure below , in my case below I did not have to execute the command because it came natively from Framworks;

The CSS file does not work although I'll be linked as shown in the code below

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
}

These are the settings that I put in my css file that is named app.component.css

body{
    background: #098778;
}

Please, is this CSS file in the decorating-only project or is it because I'm doing something wrong?

If I'm doing something wrong, what should I do to make it work?

I already know that there is a default file in the project root with style.css , it serves as a global project configuration, what I need is the app.component file .css work!

    
asked by anonymous 28.08.2018 / 11:23

1 answer

1

The css app is specific to the app component, the body above it in the logo will not work. To change the global style you have to change the style.css file

What you can try in the app.css and something like this:

:host{
    width:100vw;
    hight:100vh;
    background: blue;
} 
    
28.08.2018 / 12:47