将CSS划分为布局和主题的经验法则

Question

我想将布局CSS与主题CSS分开。但是，我有点不确定某些属性（如填充，边距，宽度或高度）的确切位置。我可以看到他们属于任何一个文件。想知道这一般的经验法则是什么？

谢谢

Answer 1

我正在研究一个类似的框架（基于SMACSS），我们将布局和视觉样式分开。我们的工作区别如下：

  

关于布局，位置，网格等的任何内容都在“布局”中。基本上任何与盒子模型相关的东西（高度，宽度，填充，边框等）加浮动，位置和一些CSS3布局属性。

其他所有东西都是视觉样式，属于其他部分。

我强烈建议您阅读Jonathan Snook's SMACSS，这是CSS样式指南的一个很好的起点。

Answer 2

IMO，你不必遵循一条硬性规则。但这有点像在Visual Studio中的考试不同而在Drupal中它的不同。但基础是相同的

• 核心CSS - 规则仅包含HTML元素的样式，例如在CSS重置或Normalize.css中使用。
• 布局 - 页面上元素的排列，包括网格系统。
• 主题 - 纯粹的视觉样式，如边框，阴影，颜色和背景，字体属性等

你可以把它们放在不同的CSS文件和Here is the link中，你可以阅读更多关于CSS架构的内容（对于Drupal 8），它会给你一个基本的想法