在Angular 10中,你可以通过在scss文件中定义颜色变量来使用分隔符。
首先,创建一个名为_variables.scss
的文件,并在其中定义你的颜色变量。例如:
$primary-color: #007bff;
$secondary-color: #6c757d;
然后,在你的组件的scss文件中导入这些变量。例如,在app.component.scss
中:
@import 'variables';
h1 {
color: $primary-color;
}
p {
color: $secondary-color;
}
最后,在组件的HTML文件中使用这些样式:
Hello, World!
This is a paragraph.
这样,h1
元素的文本颜色将会是$primary-color
定义的颜色,而p
元素的文本颜色将会是$secondary-color
定义的颜色。
记得在组件的scss文件中使用分隔符来导入_variables.scss
文件,以确保变量可以正确地被识别和使用。