CSS主样式说明

Question

我看到了关于如何使用主样式表的冲突信息，并且在测试方法时遇到了一些错误。我只是想澄清一下做这件事的正确方法。

我想将跨网站的品牌样式存储在一个主global.css表中，并在第二个.css文件中进行页面特定的调整。

例如，此代码将存在于主表中：

#headline1{
font-family: 'Roboto', sans-serif;
font-size: 96px;
letter-spacing: -1.5px;
}

这个代码将是特定于页面的：

.headline {
color: #FFFFFF;
text-align: center;
}

我最近读到一篇文章，说你不应该以这种方式使用身份证。在同一组中多次使用它时，我也遇到过问题。我最初尝试只使用类而不是ID来实现这一点，但始终没有成功。不知道为什么。

这种方法合适吗？如果没有，正确的方法是什么？

Answer 1

如果您使用创建master.css

.headline {
font-family: 'Roboto', sans-serif;
font-size: 96px;
color:#000
letter-spacing: -1.5px;
}

只要你的自定义css在master.css 之后，你就可以在每页的基础上构建/替换它

.headline {
font-size: 45px;
color: #FFFFFF;
text-align: center;
}

页面的快速示例：

<link rel="stylesheet" type="text/css" href="master.css"/>
<style>
.headline {                      // 
font-size: 120px;              // size overides master
color: #FF0000;                // color overides master
text-align: right;             // added alignment, which is overiding the browsers base css
}
</style>

我不确定这是否正是你想要的，但我希望它能帮助

在您提供的示例中，只能假设您有以下内容：

<div id="headline1"><span class="headline">Title</span></div>

这基本上意味着应用于div的任何样式，span都将继承，除非另有说明。

要进一步扩展，您还可以使用内联样式<span style="color:#FFF">，它将主导任何其他样式，除非已将!important;添加到样式元素中。