更改容器内流体元素的背景颜色

如何更改嵌套在容器流体元素中的h3元素的背景颜色？更改容器内流体元素的背景颜色

我已经设置了整个容器流体的背景颜色，但是我希望h3元素具有不同的背景颜色。我想象H3在容器流体下面，但我无法弄清楚如何改变层次结构。

这里是我的html：

<section class="container-fluid" id="portfolio"> 

<h3 id="portfolio-title">PORTFOLIO</h3>

而CSS：

.container-fluid { 
padding: 0 !important; 
} 

#portfolio-title { 
background-color: #2E3747; 
} 

#portfolio { 
background-color: #EFF0F0; 
}

感谢您的帮助！

来源

2017-03-17 sim

试试这个CSS

#portfolio { 
background-color: #EFF0F0; 
} 

#portfolio #portfolio-title { 
background-color: #2E3747 !important; 
}

我刚刚搬到组合起来，然后h3的向下，并使其重要

来源

2017-03-17 05:07:45 vkubre

不错！它的工作，但我不明白它哈哈......为什么#portfolio需要包含在第二个CSS条目？ – sim

＃套件没有必要，但它显示它是＃组合标题的父母，所以它只是将目标标题放在#portfolio中，将#portfolio和#title向下移动实际上有所帮助，因为浏览器逐行呈现CSS 。 – vkubre

让我们试试这个代码

#porfolio:not(#portfolio-title) { 
    background-color: #EFF0F0; 
} 



#portfolio-title { 
    background-color: #2E3747; 
}

选择.container-fluid但不porfolio-title。
希望得到这个帮助。

来源

2017-03-17 05:00:55 Kramer

你的代码有什么错it..this是去

方式

工作片断

.container-fluid { 
 
padding: 0 !important; 
 
} 
 

 
#portfolio-title { 
 
background-color: blue; 
 
color: red; 
 
} 
 

 
#portfolio { 
 
background-color: green; 
 
}

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
      <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<section class="container-fluid" id="portfolio"> 
 

 
<h3 id="portfolio-title">PORTFOLIO</h3>

来源

2017-03-17 05:10:37 neophyte

更改容器内流体元素的背景颜色

回答

相关问题