Question

所以我正在开发一个Web项目，一切看起来都不错，我们定义了一堆可视元素，并将它们模块化为单独的scss文件。因此，在构建我们的页面时，我们只需导入我们想要使用的元素并将它们拼接在一起。

问题是，不同的页面可能使用相同的元素，但它们的布局可能不同。一个页面上的相同按钮可能向左浮动，而在另一个页面上它可能向右浮动。一个页面上的相同模块可能有30px的上边距，而在另一个页面上它有50px的下边距。

我想的是有一个辅助样式表，每个页面包含一些微量的布局代码，这个文件是特定于页面的。当然，客户现在必须下载另一个资产，但它只是几行css。

但这是个坏主意吗？多么糟糕？如果它确实是邪恶的，那么解决这个问题的更好方法是什么？

Answer 1

很多时候，网站的<body>标记上会有一个类... ...

<body class="about"> <!-- for the about page -->

或

<body class="home"> <!-- for the homepage -->

等等。您可以执行以下操作以在单个页面上进行定位：

.button-upload {
  float: left; /* It's floated left most the time */
}

.about .button-upload {
  float: right; /* Not on the about page, though! */
}

Answer 2

这就是为什么我们在css中有类，所以你可以将样式分成类，并在必要时在每个页面中声明相关的类

有二级CSS样式表是个坏主意吗？

2 个答案: