0

例如，假设我正在使用某种前端框架来设计一个网站，例如 Foundation 或 Bootstrap。

我想定制设计的某些部分，以赋予它一种独特的感觉，一种不同于常规前端外观的感觉。我一直在做的是包含框架的 CSS，然后在包含另一个 CSS 之后，我为框架中使用的相同类编写自定义样式，使它们看起来像我独特的外观。

这是定制这样的某种前端框架的最佳方式吗？如果不是，那么缺点是什么？或者，还有更好的方法？

我意识到对样式页面的另一个请求，但除此之外，我真的只能认为浏览器在呈现页面时可能需要做更多的工作。我这样做是为了不必在框架的 CSS 中找到我想要更改的每个元素和类。

4

4 回答 4

0

如果可以，我会将原始 CSS 修改为您自己的设计。这样你就不会让用户下载一个刚刚超过另一个 css 文件的 css 文件。另外，我认为它会使调试更容易，因为您只需要查看一个文件而不是两个文件。

于 2013-08-19T00:00:36.500 回答
0

这是最好的方法，如果您不想覆盖 css 框架类，您也可以添加自己的类并设置它们的样式

于 2013-08-19T00:02:18.293 回答
0

我一直在通过在我的主文件中添加标签来处理Bootstrap中的一些元素。我知道这样做没有缺点。!importantstyle.css

.result-header .nav, .result-header .nav-bar {
    position: absolute !important;
    bottom: 4px !important;
    margin: 0px !important;
}

.result-header .nav a, .result-header .nav-bar a {
    padding: 1px 8px !important;
    font-size: 14px !important;
    border-radius: 4px !important;
}

并非每个 css 元素都需要!important，但为每个元素添加它并没有什么坏处。.result-header .nav-bar如果您只想更改某个部分的样式， 请确保您对 css ( ) 进行分层。
如果您打算更改主题样式的核心基础.nav-bar(更改并将其包含在主题的原始 CSS 之后：

.nav, .nav-bar {
    position: absolute;
    margin: 0px;
}

.nav a, .nav-bar a {
    padding: 1px 8px;
    border-radius: 4px;
}
于 2013-08-19T00:02:56.410 回答
0

我永远不会修改原始框架。正如您所提到的，良好的做法是将修改后的类包含在单独的样式表中。

优点是您从未修改过可能引入错误的原始样式，并且转换回默认框架样式就像删除添加的样式一样容易。

于 2013-08-19T00:08:37.513 回答