如何在CSS中为一个元素设置两种背景颜色？

Question

我不知道是否可能。 我正在使用bootstrap，我想分配给容器 - 流体两种背景颜色。 50％黑色，另50％红色;

 <div class="container-fluid bg-footer-text">
    <div class="container">
        <div class="col-md-5 left-text">
                asdasdsdasd

        </div>
        <div class="col-md-7 right-text">
            <div>
                <img src="<?php echo Yii::app()->createUrl("/images/pages/services/img_servicii_qa_1.jpg") ?>" alt="Development" />
            </div>
            <div class="content">
        asdsada
            </div>
        </div>
    </div>
</div>

我该怎么做？ THX

更新

我不关心容器类的颜色是什么

Answer 1

是的，可以使用线性渐变背景。

JSfiddle Backup Demo

.container-fluid {
  width: 80%;
  margin: 0 auto;
  height: 500px;
  background-image: linear-gradient(to right, black, black 50%, red 50%, red);
}

<div class="container-fluid"></div>