CSS中的@group和@override？

Question

我在样式表中看到了这一点，我想知道它是否确实做了什么，如果是的话，它会做什么？谷歌似乎对我没什么帮助。我已从代码中删除了网址，但我很好奇这是否真的做了什么。我看到它被评论出来但我只是好奇。对设计师来说，这是一种风格化的东西吗？

/* @override 
    <url of stylsheet>
*/

/* @group Colors */

/* Orange - ff7800 */
/* Gray Blue - 373d4a */

/* @end */

Answer 1

正如@frank所提到的， / * @group * / 和 / * @end * / 是Espresso使用的元数据。下面是这个元数据的屏幕截图。文件夹在窗口右侧的导航器中创建。

如果您正在使用VI，那么您可以在CSS文件中添加以下注释以创建折叠以便快速导航。

/*
 vim: set foldmethod=marker:
 vim: set foldmarker=@group,@end:
 vim: set nofoldenable:
*/

如果你不熟悉vim折叠，一些关键的组合是：

： z M - 关闭所有折叠

： z a - 打开折叠

： z a - 关闭折叠

： z a - 切换折叠打开/关闭

Answer 2

这些是HTML / CSS编辑器Espresso（以前称为CSSEdit）使用的元标记。

Answer 3

那些看起来像一些编辑器meta标签。我猜@group与visual studio中的#region相同，@override链接另一个css文件，就像intellisense一样，但是我没有看到任何编辑器支持这个，所以我可能是错的。

Answer 4

这些内容中的任何内容，

/*
  Foo...
*/

是评论。它不会被任何浏览器读取或解释，因此它对网页的呈现绝对没有影响。

我猜是这段代码，

/* @group Colors */

/* Orange - ff7800 */
/* Gray Blue - 373d4a */

/* @end */

可以由生成CSS的解释器（如SASS）在输出最终CSS时使用。

只是一个猜测......

Answer 5

许多人已经指出，@group只是一种分割或分组CSS的方法。

CSS Edit会将所有CSS放在侧栏导航中的一个很好的文件夹中，这样您就可以轻松浏览大型CSS文件。

当我转换一些包含许多CSS文件的网站时，我发现它很方便，我想将所有CSS放入一个文件中。

我将使用@group从每个原始网站的文件中对CSS进行细分...每个文件一个@group。

Answer 6

是的，它们只是对编辑CSS文件的人的评论。它对布局或功能没有影响。