html - 指出我需要在 Foundation CSS 中为面板的背景颜色更改什么?

标签 html css zurb-foundation

另一个基于基础的问题。在作为下载的一部分收到的大量代码中,我找不到在哪里可以更改特定面板的背景颜色?

这是我需要更改背景的代码部分。

<div class="row">
  <div class="large-12 columns">
    <div class="panel">
        <h3>Innovations in Development</h3>
        <p>Text Text Text</p>
        <p>Products currently in different stages of development are:</p>
        <div class="row">
            <div class="large-4 medium-4 columns">
            <p>Product A</p>
        </div>
            <div class="large-4 medium-4 columns">
                <p>Product B</p>
            </div>
            <div class="large-4 medium-4 columns">
                <p>Product C</p>
            </div>        
                </div>
    </div>
  </div>
</div>

我不知道您是否需要整个 CSS 文件,但我不知道如何找到我需要去哪里修复我想要更改的面板的背景。我试过了

.row.large-12_columns.panel {
background-color: blue !important;
}

我只添加了 '!important' 是因为我在另一个问题上看到可以覆盖其他代码?

我会张贴我正在谈论的面板的图片,但在我达到 10 个代表之前我不能。

谢谢!

编辑:

你们所有人都非常有帮助!太感谢了!如果可以的话,我会投票给你!我必须说,快速的回复救了我的命,对幼稚问题的耐心令人难以置信。非常感谢!

最佳答案

所有类之间都需要空格。

.row .large-12.columns .panel {
background-color: blue !important;
}

当你有两个没有空格的选择器时,你“链接”了这些选择器。在这种情况下,您可以链接 .large-12 和 .columns,因为它们是同一对象上的类。

关于html - 指出我需要在 Foundation CSS 中为面板的背景颜色更改什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26519564/

相关文章:

java - 在HTML中创建动态数据表的好工具或方法是什么?

html - 当容器具有最小和最大高度时,CSS overflow auto 不起作用

html - 自定义 CSS 破坏 Bootstrap 模式

navigation - Zurb Foundation 粘性导航栏

html - 如何使 zurb Foundation 打印在浏览器中显示的内容

php - 如何获取请求 Tor 网页的客户端 IP?

jQuery.animate() 似乎将持续时间参数作为延迟

JavaScript - 使用 window.open() 打开一个 URL 并在打开的页面上进行全选

javascript - 使用一个文件显示到很多网页

javascript - 如何在基础 CSS 中水平获取文本渲染列?