相关疑难解决方法(0)

在angular2中更改伪元素的样式

是否可以使用[style][ngStyle]在angular2中更改伪元素的样式?

为了获得div上的模糊效果,就像叠加一样,我应该在伪元素上设置背景图像.

我试过类似的东西

<div class="blur" [style.before.backgroundImage]="'url('+ featuredImage[i] + ' )'">
Run Code Online (Sandbox Code Playgroud)

它不起作用.我也尝试过这个

<div class="blur" [ngStyle]="'{:before{ background-image:url('+ featuredImage[i] + ' )}}'">
Run Code Online (Sandbox Code Playgroud)

css pseudo-element ng-style angular

20
推荐指数
3
解决办法
1万
查看次数

Angular 5:如何在中央文件中定义调色板

我想在我的项目的中央文件中声明我的调色板。

目前我正在使用一个包含地图的 Injectable 来引用我使用的所有颜色。例子:

@Injectable()

export class COLOR_DICTIONARY {
private static COLOR_MAP: Map<string, string> = new Map<string, string>();

 constructor() {
    COLOR_DICTIONARY.COLOR_MAP.set('primary', '#339988');
 }

 get(key: string) {
    return COLOR_DICTIONARY.COLOR_MAP.get(key);
 }
}
Run Code Online (Sandbox Code Playgroud)

然而,这迫使我使用 ngStyle 引用标记中的所有颜色,而不是直接在 css 中

[ngStyle]="{'color': color_dictionary.get('primary')}"
Run Code Online (Sandbox Code Playgroud)

我目前正在对整个网站进行更大规模的重新设计,改变样式文件和标记文件中的样式变得很麻烦。(甚至用于添加/更改/删除颜色的打字稿文件)。

如何在中央文件中引用调色板 - 最好是更静态的文件,如 XML 文件或其他内容,可以直接在 css 文件中引用。

我愿意将样式转换为 scss 文件,如果这会让它更容易,或者它有利于目的。

该项目与 webpack 捆绑在一起,因此也感谢有关如何捆绑解决方案的任何提示。

css sass styling color-palette angular

1
推荐指数
1
解决办法
1930
查看次数

标签 统计

angular ×2

css ×2

color-palette ×1

ng-style ×1

pseudo-element ×1

sass ×1

styling ×1