html - 如何仅为列中的div设置背景颜色

Question

我只想为列中的 DIV 设置背景色，但我在整个列上都设置了背景色。这是怎么做到的？这是我的代码(非常简单)

.news {
    background-color: #fff;
    padding: 15px 20px;

    .news-thumb {
        img {
            border-bottom: 5px solid $Brown;
        }
    }
}

和 HTML:

<div class="col-lg-4">
    <!-- DRUGI NEWS -->
    <div class="news">
        <div class="news-thumb">
            <img src="images/NewsThumb.png" alt="" class="img-responsive" />
        </div><!-- /.news-thumb -->
        <div class="news-excerpt">
            <p>
                Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam,
                eaque!
            </p>
        </div><!-- /.news-excerpt -->
    </div><!-- /.news -->
</div><!-- /.col-lg-6 -->

更新这是 JSFiddle 我有全宽背景，但我只想要“my-div”

Answer 1

真的很难理解你想要什么......试试这个 CSS:

/**
 * this select every DIV that match "col" in the class
 */

div[class*=col] {
  background-color: red
}




.news {
   background-color:green;
    padding: 15px 20px;

    .news-thumb {
        img {
            border-bottom: 5px solid yellow;
        }
    }
}