Стиль SCSS не применяется в Angular - PullRequest
Новая
       5

Стиль SCSS не применяется в Angular

0 голосов
/ 17 октября 2019

Следующий стиль SCSS не применяется в Angular:

app.component.scss 

body{
  background-color:red;
}

app.component.ts 

import { Component, OnInit } from '@angular/core';
import {ActivatedRoute} from '@angular/router';
import { ViewEncapsulation } from '@angular/core'

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})

export class AppComponent implements OnInit {
}

HTML: 

<body>
  <nav>
  </nav>
</body>

Ответы [ 2 ]

1 голос
/ 17 октября 2019

Ваш app.component.html не может иметь тег body, потому что angular живет в теге app-root, который создается внутри тега body страницы index.html

Фактически отображается как 

<body>
<app-root>
</app-root>
</body>

Но то, что вы пытаетесь, отображается как 

<body>
<app-root>
<body>
<nav>
</nav>
</body>
</app-root>
</body>

И scss применяется как 

body[app-root]{ background-color:red}

, который не будет работать.

Таким образом, если вы хотите применить цвет фона, вы должны установить стиль в глобальном файле scss, т.е.

Style.scss, который присутствует в корневой папке приложения, или искать style.scss в палитре команд. редактора

1 голос
/ 17 октября 2019

Вы не можете стилизовать тег body из компонента приложения. Если вы хотите установить цвет фона так, как вам нужно, в файле styles.scss else.

Также при условии, что вы хотите установить цвет фона для тега в компоненте приложения, тег должениметь содержимое, прежде чем вы сможете увидеть цвет фона или вы можете просто установить высоту для указанного тега, а затем цвет покажет

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...