为什么代码组合可以工作但不能覆盖Bootstrap Jumbotron H2样式的单个实例？

Question

我对这里的特异性有点困惑......

.container-fluid, .row, .col-md-12, .jumbotron, h2 {
background-color: blue;
}

.container-fluid.row.col-md-12.jumbotron, h2 {
background-color: blue;
}

可行，但这些代码中的任何一个都无法正常工作......

HTML是：

  <div class="container-fluid">
<div class="row">
    <div class="col-md-12">
        <div class="jumbotron">
            <h2>
                Hello, world!
            </h2>

使用我的本地CSS文件覆盖bootstrap CDN（或bootstrap.min）的正确方法是什么？

我的文件链接如下：

 <link href="css/bootstrap.min.css" rel="stylesheet"> 
 <link href="css/style.css" rel="stylesheet">

Answer 1

在自定义CSS中覆盖具有更高特异性的类 看看这个答案。 Creadit @Matt Ball Override a css Class