在Angular7中,我們可以使用angular.json來導入全局css文件。可以在項目根目錄下找到這個文件。
首先,我們需要在angular.json中的styles數組中添加全局css文件路徑:
```json
"styles": [
"src/styles.css"
],
```
接下來,我們可以在styles.css中導入其他css文件,例如:
```css
@import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
@import '../node_modules/font-awesome/css/font-awesome.min.css';
```
注意:在導入其他css文件時,需要使用相對路徑或絕對路徑。
如果我們想在組件中導入css文件,可以使用@import語句。例如,在app.component.css中導入style.css文件:
```css
@import 'styles.css';
```
最后,我們還可以使用styleUrls屬性在組件中引用css文件。例如,在app.component.ts中:
```typescript
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'My App';
}
```
在上述代碼中,我們將app.component.css文件作為組件樣式文件引入。注意:styleUrls屬性的值必須是一個數組。
在Angular7中,我們可以使用以上幾種方法來導入css文件。不管是全局樣式文件還是組件級樣式文件,我們都能輕松實現樣式的引入。
上一篇mysql修改表中字段名
下一篇eval將json轉數組