Html 获取父div'；要显示的背景图像

我在我的网页上有一个水平带，这是一个叫做水平带的div类，我把它分为两个独立的类，分别叫做左水平和右水平，所以我可以在左半部分有一个新闻标题列表，在右半部分有一个电子邮件注册表。水平条div有一个背景图像，但是现在我添加了左水平和右水平类，图像没有显示出来

.horizontal-strip {
    background: url("ColBackground.png") scroll center top repeat;
    margin: auto auto 10px;
    padding: 5px;
    width: 950px;

}

.horizontal-strip .left-horizontal {
    float: left;
    width: 450px;

}

 .horizontal-strip .right-horizontal {
    float: right;
    width: 450px;

}

这是HTML代码的外观：

<div class="horizontal-strip">
    <div class="left-horizontal">
        <h1>Top Stories</h1>


        <ul class="news-listing">
        <li>list of links here... </li>
        </ul>

    </div>  <!-- Closes left-horizontal div -->

    <div class="right-horizontal">

        <h1>News Sign-Up</h1>
        <p>Enter your email address below to receive automatic updates when a new story is added.</p>

        <form action="">
            Email: <input name="email" type="text">
            <input name="submit" value="Submit" id="submit-button" type="submit">
        </form>

    </div>  <!-- Closes right-horizontal div -->
</div>  <!-- Closes horizontal-strip div-->

头条新闻

这里的链接列表

新闻注册
在下面输入您的电子邮件地址，以便在添加新故事时接收自动更新

电邮：

有人能告诉我为什么背景图像没有显示出来吗？

来自“”

---

我希望这对你有效：）

您还没有清除浮动。将

overflow:hidden

添加到您的

水平条{}

。这将清除浮动并使包装填充以包含内容。

如果您添加另一个样式为clear的div：在右水平div关闭之后和水平条div关闭之前，即在最后一行之前，它应该修复背景。

没问题，很高兴为您服务！查看此浮动清除方法的更多信息。

.yourClass {
/* Fallback for web browsers that don't support RGBa */
background-color: rgb(0, 0, 0);
/* RGBa with 0 opacity */
background-color: rgba(0, 0, 0, 0);
/* For IE 5.5 - 7 */ - /* first two numbers in #00000000 define opacity */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00000000, endColorstr=#00000000);
/* For IE 8 */ - /* first two numbers in #00000000 define opacity */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00000000, endColorstr=#00000000)";
}