twitter-bootstrap 需要覆盖 CSS 背景颜色

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19362759/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 18:51:06  来源:igfitidea点击:

need to override a CSS background color

jqueryhtmlcsstwitter-bootstrapbackground-color

提问by user2847749

so I have the following

所以我有以下几点

.select, 
.input, 
.schedule, 
.editableFields 
{
cursor: pointer;
background-color: blue;
}

and this overrides the following:

这将覆盖以下内容:

#past .layer.color {        
background-color: #E5D403 !important;   /*this needs to be the first priority color*/
 }

EDIT: If I just have this second CSS, it does work! But when I add the blue it colors all it needs to and OVERRIDES #past (I dont want it to do this!) But I need the second background-color to override the first background-color. I have tried giving it lots of IDs and lots of classes and also using !important, but nothing seems to work...please help! (I don't know if it matters, but I am also using twitter bootstrap, but I have all of my css rules in a custom.css)

编辑:如果我只有这第二个 CSS,它确实有效!但是当我添加蓝色时,它会为它需要的所有颜色着色并覆盖#past(我不希望它这样做!)但我需要第二个背景颜色来覆盖第一个背景颜色。我试过给它很多 ID 和很多类,也使用 !important,但似乎没有任何效果......请帮忙!(我不知道这是否重要,但我也在使用 twitter bootstrap,但我的所有 css 规则都在 custom.css 中)

I also tried adding an inline css to the html. There is a ton of html, so I'll just put the top part

我还尝试向 html 添加内联 css。有很多 html,所以我只放最上面的部分

<div class="accordionGroups">
            <div class="accordionHeading">
                <a class="accordion collapsed" data-toggle="collapse"
                    data-parent="#mainAccordion" data-target="#collapseThree"> <i
                    class="twistyIcon"></i> Layers
                </a>
            </div>
            <div id="collapseFirst" class="accordion-body collapse">
                <div class="accordion-inner scrollable">
                    <ul id="layers-dropdown-menu">
                       <li><label class="checkbox" id="past"> <span class="layer color legend"></span> Past
                       </label></li>

as background-color:#E5D403 but it gave me an error and Im not sure why (maybe I put it in the wrong place in the html?)

as background-color:#E5D403 但它给了我一个错误,我不知道为什么(也许我把它放在了 html 的错误位置?)

The following doesn't work either:

以下也不起作用:

.checkbox span .layer.color.legend
{
 background-color: #E5D403 !important;
}

回答by BT643

This doesn't work?

这行不通?

#past {        
   background-color: #E5D403 !important;
}

回答by Shauna

.layer.colorrefers to an element that is empty, and therefore does not take up any screen space.

.layer.color指的是一个空元素,因此不占用任何屏幕空间。

What should the output look like? If you have an image of what you're expecting, we might be able to help you more.

输出应该是什么样的?如果您对所期望的内容有一个了解,我们或许可以为您提供更多帮助。

Sans that, if you want "Past" to have the new background color, you need to put it inside the span's tags - <span class="layer color legend">Past</span>

没有,如果你想让“过去”有新的背景颜色,你需要把它放在跨度的标签里—— <span class="layer color legend">Past</span>

回答by user2847749

I finally figured it out, guys. I couldn't fix this error from within the CSS. Since my page was being dynamically updated, I had to fix this in javascript, when I was creating each of the rows.

我终于明白了,伙计们。我无法从 CSS 中修复此错误。由于我的页面正在动态更新,因此我必须在创建每一行时在 javascript 中修复此问题。

if(notYellowRow){
    $row.find('.select').css('background-color', 'blue');
    $row.find('.input').css('background-color', 'blue');
    $row.find('.schedule').css('background-color', 'blue');
}

回答by Murali Murugesan

You missed space between class

你错过了课堂之间的空间

try this

试试这个

HTML

HTML

 <span class="legend"> TEXT HERE</span>

CSS

CSS

span.legend
{
 background-color: #E5D403 !important;
}