CSS冲突问题

Question

我有两个单独的CSS文件，每个文件都有一个页面的某个部分。具体是我为主内容（如页眉，页脚等）制作的，另一个是可能是动态的主要内容。我只是将两个CSS文件链接到页面，但看起来＆＃34;主要内容＆＃34;正在超越＆＃34;掌握内容＆＃34;。如何解决这个问题呢 ？或者如何限制第二个css文件只针对我可以定义的某个HTML部分的样式？ 我已经尝试了！important css属性。

Answer 1

你应该避免！重要的是你可以。这是不好的做法。为目标元素使用更好的类名。您应该阅读CSS特性以及良好的类命名约定，如SMACSS或BEM。

Answer 2

  

我只是将两个CSS文件链接到页面，但看起来是   “主要内容”的风格是超越“大师”的风格   内容”。

那是因为你在加载主内容样式表时建立了一些样式，然后你加载了主要内容样式表 ...然后覆盖了你的一些样式已经宣布了。

这是级联。这是 应该发生的事情 。

<强> E.g。

如果您的主内容样式表：

testCompile 'org.json:json:20140107'

然后，在您的主要内容样式表中，您有：

header h1 {
color: blue;
}

您的h1 { color: red; } （<h1>）将为<header>。

<强>加了：

通过熟悉浏览器的 DOM Inspector ，您将获得巨大的帮助。

我的偏好是Firefox和 Firebug ，其他人更喜欢Chrome和 Chrome DevTools 等。

DOM Inspector 将能够显示正在应用于元素的样式及其应用顺序......

...这样你就可以看到哪些样式被其他（后来的）样式覆盖了。