Html 在嵌套div中获取任何应用样式的内容时出现问题

我已经问过谷歌了，我花了很长时间做实验。我不可能重新创建整个HTML和CSS环境，但这是其中的一部分：

#页脚版权所有{
明确：两者皆有；
颜色：黑色！重要；
字体大小：12px！重要；
文本对齐：居中！重要；
}

此文本不受格式限制

在上面的示例中，您有这个

<div class="container">
  <p id="footer-copyright">This text is actually NOT immune to formatting</p>
</div>

当，你想要的是它的样式与此样式

#footer-copyright p
{
  clear:both;
  color:black !important;
  font-size: 12px !important;
 text-align:center !important;
}

因此，您所需要的只是让您的代码如此

<div class="container">
  <p id="footer-copyright">Copyright © 2017 - Do The Most Good, Montgomery County, MD</p>
</div>

版权所有©2017-尽最大努力，马里兰州蒙哥马利县

---

这只是一个例子，页脚版权元素（p标记）没有被分配样式，因为没有设置ID标记。

它在使用代码的代码段中起作用（见下文）

如果需要更具体的选择器，可以使用此选择器：

footer#footer > div.container > p#footer-copyright { ... }

这将考虑代码中包含的所有标记、类和ID

（我在规则中添加了背景色以进行验证）

footer\footer>div.container>p\footer版权所有{
明确：两者皆有；
颜色：黑色！重要；
字体大小：12px！重要；
文本对齐：居中！重要；
背景：#fa0；
}

此文本实际上不受格式限制

我正在查看您发送的页面上的HTML，而不是您发布的代码

指示样式的声明是：

#footer p{
    color:#fff;
}

实际上，以下代码根本没有运行：

#footer-copyright p{
    clear:both;
    color:black !important;
    font-size:12px !important;
    text-align:center !important;
}

您可以看到代码中没有

#页脚版权

您可以在控制台中运行以下操作：

$('#footer-copyright p').length;
$('#footer p').length;

---

#footer copyright

返回长度为零。

似乎可以正常工作。您需要提供一个示例来说明问题。我赞成你在这里力求简明扼要，但它没有显示出实际的问题。尝试并扩展您的示例以实际显示问题。在你这边一步一步地做这件事实际上可能会告诉你问题所在。没有更多的信息，我们在猜测。好吧，也许在一个孤立的环境中，CSS可以按设计工作。在实际的网站上，只是f'ing没有，这就是我想要理解的。该网站的测试版（未发布），所以我上传了“理想”footer.php，就像上面的伪代码一样，但在这个网站上，文本是白色的，大小不正确，而且。。。这是指向站点的URL:。在真实站点上，与该元素匹配的唯一规则是

#footer p{color:#fff}

。HTML标记没有id

页脚版权

。这只是一个普通的

标记，规则不适用。我可以试试看。你能解释一下这和我在Chrome中看到的有什么关系吗？Chrome CSS层次结构显示html body footer#footer.fullwidth div.container p。这更为具体，使用了此特定文件路径中的每个元素、类和ID<代码>html正文只是

页脚

，

页脚#页脚的父元素。fullwidth

除了已分配给它的ID之外，还添加了分配给

页脚

的类。它*没有添加的一件事（我不知道为什么）是p

，即我在选择器中添加的

footer copyright`的ID。无论如何，这两个选择器都非常具体。如果没有任何其他选择器故意尝试更加具体，这两种选择器都应该可以工作。有趣的是（如果这没有让我发疯的话），它在Windows 10的Edge上工作，在Chrome上不工作。请访问实际的网站：。在那里你会发现它不起作用。文本是白色的大文本，而不是黑色的小文本。为什么呢？如果我将特定ID附加到该段落、DIV或SPAN，然后为该ID设置样式，为什么会忽略它？我真的很想知道。顺便说一句，既然你不在我的脑海里，我应该告诉你，文本是每一页最底部的版权信息。谢谢这应该会有帮助。

#footer-copyright p{
    clear:both;
    color:black !important;
    font-size:12px !important;
    text-align:center !important;
}

$('#footer-copyright p').length;
$('#footer p').length;