CSS会影响错误部分中的元素

Question

我已经在这个网站上工作了一段时间，我遇到了一些问题，但其中很多只是小混乱。

现在我无法弄清楚这里发生了什么。

http://goo.gl/oEuoU5

如果您查看顶部文字＆＃34;今天开始发展您的业务＆＃34;，您可以看到它有一些填充。

现在，如果您查看元素检查器，您可以看到该样式来自此CSS

.home #pricing h1, h2, h3 {

    padding: 1em;

}

但问题是，该标题不在#pricing部分。所以我无法理解它为什么被设计风格。

我尝试了一些像

这样的事情

 #pricing h1, h2, h3 {

    padding: 1em;

}

或

.pricing h1, h2, h3 {

    padding: 1em;

}

但似乎没有任何效果。我甚至试过看看我是否在文档流程中搞砸了但是我找不到任何问题。

非常感谢任何帮助。

Answer 1

#pricing h1, #pricing h2, #pricing h3 {
    padding: 1em;
}

这应该可以解决问题。当用逗号分隔类名时，请确保指定所有子类/父类。

因此，元素的样式是因为在第一次昏迷后你只指定了h2和h3，所以它在DOM中设置所有外观的样式。

Answer 2

您正在获得这种不受欢迎的样式，因为您没有使用正确的语法来为同一元素中的多个项目设置样式。

这将产生你想要实现的目标：

#pricing .home h1, 
#pricing .home h2, 
#pricing .home h3{

    padding: 1em;

}

您拥有它的方式，您在h1的元素中设置了id = "pricing"样式，然后在整个文档中设置了h2和h3。