Question

我有footer.html页面的页脚，相应的css是footer_style.css文件，有6000行代码。有一些元素（例如＆＃39; p＆＃39;标记或＆＃39; a href＆＃39;标记）在footer_style.css文件中给出样式，如p {color：red}。

我有另一个文件用于页面的正文部分，其中包含＆＃39; p＆＃39;标签＆amp; ＆＃39; a href＆＃39;标签元素。

问题是当页面加载时，由于footer_style.css文件中应用的样式，页脚的css属性由body部分元素导入。

我认为解决方案是添加＆lt; \ div id =＆＃34; footer_wrapper＆＃34;＆gt;到footer.html并改变css，如#footer_wrapper p {}和#footer_wrapper a {}等。

但是有1000个标签。 css文件是6000行巨大的。

任何其他解决方案的人？

Answer 1

现在您可以使用sassmeister。

粘贴整个css文件，然后在顶部添加#footer_wrapper，在底部添加}

Answer 2

你可以使用LESS。您可以在较少的文件中导入css文件。

创建文件footer-style.less并写：

#footer-wrapper { /*all styles from footer_style will apply to html inside div with id footer-wrapper */
    @import "footer_style.css";
}

您需要使用一些任务构建器（如grunt）为项目添加更少的管道。