CSS分离代码的部分 [英] CSS separating code in parts

问题描述

 我想知道是否有一种方法可以在单个文件中分离CSS的各个部分/块，从而更有组织性，并具有更高的可读性。例如，当我们为元素设置一些样式时，它看起来像这样：
节点（加号和减号图标），可以关闭/打开

 所以，我想知道的是，有一种方法可以创建类似于节点或'区域'的关闭/打开CSS部分的方法，例如：想要将单个部分中用于DIV的所有样式分开，另一部分中的按钮部分等等。然后我可以关闭/打开那些部分。

 有可能的？
我知道我可以在很多文件中分离CSS，但我希望它在一个单独的文件中。

解决方案

显然，Visual Studio已经支持CSS，正如 Steven Follis的博客。

您可以添加定义区域的特定评论。

语法是：

  / *＃地区* / 
 
 .your.css.goes.here {
} 
 
 / *＃endregion * / 
  

其他编辑器当然可以支持类似的语法，但很多不会。 CSS没有区域的本地语法，所以这些注释在CSS中没有任何语法值，并且只被这个特定的IDE使用。

但除了使用您也可以使用单独的文件来组织代码并使用脚本将它们连接在一起。这可以是一个简单的脚本，也可以是其他人建议的更高级的预处理器，但总的来说，您可以以更灵活的方式组织CSS，并且在页面中仍然有一个（最好是最小化）文件。

如果你开始使用这些，我可以从个人经验中推荐SCSS。它比SASS更接近CSS。我之前使用过LESS，但我认为它的一些功能缺乏或者模糊。 SCSS更符合逻辑设计。

  I was wondering if there is a way to 'separate' parts/pieces of CSS in a single file, to be more organized and have more readability. For example, when we set some style to an element, it appears like that: Nodes (plus and minus icon) that can be closed/opened

  So, what i want to know is, there is a way to create something like nodes or 'regions' to close/open parts of CSS, like: Want to separate all styles that I use for DIVs in a single part, Buttons in another part, etc.. then I can close/open those parts specifically.

  It is possible? I know that I can separate the CSS in many files, but I want it in a single file.

解决方案

Apparently Visual Studio already supports this for CSS, as found on Steven Follis' blog.

You can add specific comments that define a region.

The syntax is:

/*#region Description of the region*/

.your.css.goes.here {
}

/*#endregion*/

Other editors may support a similar syntax of course, although many won't. CSS doesn't have a native syntax for regions, so these comments don't have any syntactic value in CSS and just used by this particular IDE.

But apart from using regions, you may as well use separate files to organise your code and use a script to concatenate them together. That can be a simple script, or a more advanced pre-processor as suggested by others, but the general point is that you can organise the CSS in a more flexible way, and still have a single (preferably minimizes) file in your page.

Should you start using those, I can recommend SCSS from personal experience. It's more close to CSS than SASS. I used LESS before, but I thought some of it's features were lacking or just vague. SCSS is more logically designed.

这篇关于CSS分离代码的部分的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！