由于 _reboot.scss，无法将背景图像设置为特定的 Angular 组件答案

【问题标题】：Cannot set background-image to specific Angular component due to _reboot.scss由于 _reboot.scss，无法将背景图像设置为特定的 Angular 组件
【发布时间】：2019-07-10 22:02:14
【问题描述】：

我正在尝试使用以下代码将 background-image 设置为我的特定 Angular 组件：

body { 
        background-image: url(...); 
        background-size: cover;
        background-repeat: no-repeat; }

这段代码放在Angular组件的.css文件中。

但是，在浏览器控制台中，我注意到 _reboot.scss 类（可能来自 Bootstrap）正在将我上面的代码 sn-p 覆盖为默认背景色。

我已经尝试了几乎所有的东西，改变背景图像的唯一方法是使用 F12 模式在浏览器中修改 _reboot.scss 类。

【问题讨论】：

你试过background-image: url(...) !important;
给 body 一个类，例如 'bg'，然后应用你想要的任何样式
您关心的是background-color 还是backgroud-image？
@dileepkumarjami 是的，我试过了！important 还是不行。我担心的是背景图片
@mostafaturad 我已经尝试将整个组件放入一个 div 并给它一个包含背景图像的类，但是它没有被拉伸到全屏

标签： css angular bootstrap-4

【解决方案1】：

您可以将代码设置为：

._reboot.scss { 
        background-image: url(...); 
        background-size: cover;
        background-repeat: no-repeat; }

覆盖引导程序。

或者，把 !important 给你的 css ：

body { 
        background-image: url(...)!important; 
        background-size: cover;
        background-repeat: no-repeat; }

【讨论】：

不幸的是，我已经尝试将 !important 添加到我的代码中，但它并没有解决我的问题。