Angular 2 - 全局 CSS 文件 [英] Angular 2 - Global CSS file

问题描述

是否可以将全局 CSS 文件添加到 Angular 2?目前，我有许多具有相同按钮样式的不同组件 - 但每个组件都有自己的 CSS 文件和样式.这是令人沮丧的变化.

Is it possible to add a global CSS file to Angular 2? At the moment I have many different components that have the same button styling - but each of the components have their own CSS file with the styling. This is frustrating for changes.

我在 Stack Overflow 上的某处阅读并添加:

I read somewhere on Stack Overflow to add:

import { ViewEncapsulation } from '@angular/core'; //add this

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  encapsulation: ViewEncapsulation.None            //add this
})

所以我在根组件中添加了 ViewEncapsulation 行，然后将 CSS 样式添加到根应用 CSS (app.component.css) 并从单个组件 CSS 文件中删除了 CSS 样式，但它不起作用.

So I added the ViewEncapsulation lines in the root component, then added the CSS styling to the root app CSS (app.component.css) and removed the CSS styling from individual component CSS files, and it did not work.

当然有添加全局 CSS 文件的方法吗?我是否需要向各个组件添加一些内容才能让它们访问全局 CSS 文件?

Surely there is a way to add a global CSS file? Do I need to add something to the individual components to make them access the global CSS file?

推荐答案

您可以简单地在主 html 文件中导入 css.

You can simply import the css in the main html file.

这篇关于Angular 2 - 全局 CSS 文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！